Javascript画布冲突检测问题

Question

我已经为这个问题苦苦挣扎了片刻，希望得到一些帮助。 所以基本上就是这种情况。 我有多个方块（以100乘100为单位）向上移动画布，并在一段时间后再次重置为底部。 我还有一个可左右移动的可控多维数据集（20 x 20）。 游戏的目标是躲闪立方体直到达到一定的时间限制。 但是我无法终生获得“飞船”和正方形工作的碰撞检测。 有人有什么想法吗？ 这是我的一些代码，在此方面已经取得了一定的成功（只有“太空飞船”的左侧碰到了其他立方体寄存器）。

for(var n = 0; n < block.length; n++){
if(y > block[n].y && y < (block[n].y + 100 )){
    console.log(y + 100 + " " +  "y check1");
    if(x > block[n].x && x < block[n].x + 100){
        x += 20;
        console.log(x + 100 + " " +  "x check1");
     }
  }
}

注意： x和y =船的位置， block.y和block.x =连续循环检查的块的位置。

如果需要，我可以提供其余的代码。 谢谢！

Answer 1

这是基本的碰撞检测。 有趣的是，它并不是真正在寻找碰撞，而是物体之间的间隙。 没有差距，很受欢迎。

if (rect1.x < rect2.x + rect2.width &&
   rect1.x + rect1.width > rect2.x &&
   rect1.y < rect2.y + rect2.height &&
   rect1.height + rect1.y > rect2.y) {
// collision detected!
}