javascript - Canvas 碰撞？

测试我的游戏，当用户和怪物碰撞时，我希望警报弹出但没有运气：

function die() {

  for (var i = 0; i < monster.length; i++) {
    if (user.destinationX === monster[i].destinationX && user.destinationY === monster[i].destinationY {
      alert("die");
    }
  }
}

最佳答案

我将提供合并的答案和解释。如果您喜欢解释，请记下karaxuna或user2317489。

正如Kolink提到的那样，您的问题是吃豆人的毛病，或者说，您的怪兽不只是像素-它们具有自己的大小。您当前正在检查一个对象的原点，并查看它是否与另一个实体完全相同-如果有的话，这种情况很少发生。相反，您需要检查的是怪物是否至少具有一个公共点（换句话说，是碰撞检查）。

可以通过检查一个点的原点是否在另一个的边界框内，换句话说，是否monster2.x <= monster1.x <= (monster2.x+monster2.width)和monster2.y <= monster1.y <= (monster2.y+monster2.height)来简单地做到这一点。 Arnelle Balane所提供的代码没有任何解释。

这并不总是一个很好的近似值，因为这会盲目地假设您的怪物是正方形。要使其变成圆圈，您需要检查一个怪物的中心是否在另一个中心的一定距离内（该距离是公制，并使用sqrt(pow(x,2)+pow(y,2))计算。不过，所有这些都是更详细的信息）。