碰撞检测功能始终 returns true

Question

我可能遗漏了一些非常简单的东西，但我不明白为什么这个函数总是 returns true 并记录两个对象，即使它们不在彼此附近。我的代码：

var collideRect=function(obj1, obj2){
   var x1=obj1.x,y1=obj1.y,x2=obj2.x, y2=obj2.y;
   var b1=obj1.breadth,h1=obj1.height;
   var b2=obj2.breadth,h2=obj2.height;
   var xCollide, yCollide;
// determine if the x values are closer than half the breadth of each rectangle to each other
   if(x1+b1/2>x2-b2/2||x1-b1/2<x2+b2/2){xCollide=true};
// determine if the y values are closer than half their heights from one another 
   if(y1+h1/2>y2-h2/2||y1-h1/2<y2+h2/2){yCollide=true};
   if(xCollide&&yCollide){
    console.log(JSON.stringify(obj1)+".   "+JSON.stringify(obj2)) ;
    return true;
   }; 
}

None 个值是 ever0。该函数接受每个具有属性的对象：宽度，高度， X， y。这些都是正数。我检查了每个语句的操作顺序，它们都很好。

Answer 1

您的 if 语句不正确。请参阅下面的调整算法和基本控制台断言。

本质上你需要检测是否有任何边缘之间没有 space。如果没有 space 你知道发生了碰撞。

分解如下：

第一步.

检查矩形 1 的左边缘。

如果矩形1的左边缘小于矩形2的右边缘(x2 + b2)，则矩形1的左侧和矩形2的右侧可能有交集。

第二步。

检查矩形 1 的右侧。

如果矩形1的右边大于矩形2的左边，则矩形1与矩形2相交于矩形2的左边。我们使用 && 检测到这两个条件都为真，以确保发生了碰撞。

我们对两个矩形的 y 坐标进行完全相同的检查，以检测矩形是否在 y 平面上相交..

var collideRect = function (obj1, obj2) {
 var collision = false;

 var x1 = obj1.x,
 y1 = obj1.y,
 x2 = obj2.x,
 y2 = obj2.y;

 var b1 = obj1.breadth,
 h1 = obj1.height;

 var b2 = obj2.breadth,
 h2 = obj2.height;

 var xCollide,
 yCollide;
        // if left edge of rect1 is left of the left edge of rect2 plus its 
        // width AND left edge of rect1 plus rect1's width is greater than 
        // the left edge of rect2, we have an x-coordinate collision.
        // if either set of conditions is false, the rects don't overlap.
 if (x1 < x2 + b2 && x1 + b1 > x2) {
  xCollide = true;
 }
    // same as the x check but on the y plane
 if (y1 < y2 + h2 && h1 + y1 > y2) {
  yCollide = true;
 }

 if (xCollide && yCollide) {
  console.log(JSON.stringify(obj1) + ".   " + JSON.stringify(obj2));
  collision = true;
 }
 return collision;
}

// test
var rect1 = {
 x: 5,
 y: 5,
 breadth: 50,
 height: 50
};
var rect2 = {
 x: 20,
 y: 10,
 breadth: 10,
 height: 10
};

console.assert(collideRect(rect1, rect2) === true); // collision

var rect3 = {
 x: 55,
 y: 55,
 breadth: 50,
 height: 50
};
var rect4 = {
 x: 20,
 y: 10,
 breadth: 10,
 height: 10
};

console.assert(collideRect(rect3, rect4) === false); // no collision

碰撞检测功能始终 returns true

Function for colision detection always returns true

javascript

collision-detection