HTML5 -冲突

Question

我正在做一个自上而下的游戏，这个游戏将包含许多简单和复杂的碰撞。

在做了一些研究之后，我明白我必须总是在我的代码中将我的角色与“对象”进行比较-然后检查碰撞计算。

例如：

CheckCollisions(Player, Object);

这意味着我必须在我的代码中添加场景中每一个可碰撞的物体：

CheckCollisions(Player, Building1);
CheckCollisions(Player, Building2);
CheckCollisions(Player, Trash);
CheckCollisions(Player, Bench1);
CheckCollisions(Player, Bench2);
CheckCollisions(Player, Office1);
CheckCollisions(Player, Office2);

首先，我的对象可能不是简单的矩形，它们可能是复杂的形状。其次，它们中的一些可能有自己的轮换。第三，如果我的场景中有超过数万个可牧羊犬对象，会发生什么？

有没有更简单的方法来检查HTML5/JS游戏中的冲突？

这有可能吗？我真的只是在寻找一些建议和建议。

谢谢

Answer 1

1-您不需要为游戏中的每个对象编写一行代码。将它们放入一个数组中，并对该数组进行循环：

var collidableObjects = [Building1, Building2, Trash, Bench1, Bench2,Office1, Office2];
var CheckAllCollisions = function() {
    for (var i=0; i<collidableObjects.length; i++) {
        CheckCollisions(Player, collidableObjects[i]);
    }
}

2-如果你有复杂的碰撞检查(即旋转的形状，多边形等)，你可以首先检查一个简单的矩形检查(或半径检查)，如果第一个检查返回true，则进行更精确的检查。

3-如果你计划有成千上万的对象，你应该有更智能的数据集合，例如按X坐标排序的对象，这样你就可以快速避免检查所有大于Player.X+100和小于Player.X-100的对象(使用二进制搜索)，或者将对象拆分为网格并只检查玩家周围3x3网格单元中的对象。

Answer 2

对于游戏中的每个对象都有一个命名变量是很少见的。通常，您将所有对象存储在一个数据结构(如数组)中，当您需要对所有对象执行某些操作时，可以在此数组上执行for循环。

一些重要的对象，比如玩家角色，可以有一个自己的变量，但它们也应该在"all objects“数组中，所以你不需要编写一个特殊的处理来包含玩家角色。

关于性能:当您针对所有内容检查所有内容时，需要执行的冲突检查量会以二次曲线的形式增加。但是，当您只检查那些已经彼此接近的对象的碰撞时，您可以减少工作量。在检查冲突之前，请执行以下操作：

1. 将比赛场地划分为矩形区域(区域必须至少与最大的对象一样大)。
2. ，然后将每个对象指定给其左上角所在的区域。然后，您可以选择每个区域，并检查其中的每个对象与该区域中的其他对象以及该区域右侧、下方和右侧的所有对象之间的冲突(对于重叠区域边界的对象)。

当您有非常复杂的形状时，您还可以通过为每个形状计算一个边界矩形(它适合的最小矩形)来加速碰撞检测。在检查两个对象之间的碰撞之前，首先要检查它们的边界矩形是否相交。当它们不相交时，复杂的形状就没有机会相交，您可以跳过所有复杂的计算。

Answer 3

到目前为止，每个人都已经指出，对象数组比单独命名所有对象要好得多。

碰撞检测的一种更简单的方法可能对您有效，那就是有一个中心对象来跟踪所有占用的空间。例如，让我们暂时将其命名为LocationTracker。

假设您只使用x和y轴，那么您可以拥有一个存储X和Y位置的Point对象(如果您想获得更好的效果，还可以使用timestamp)。每个对象在移动时都会发送它所占用的所有Point的数组。例如，您可以调用locationTracker.occupySpace(player[i], array(point(3,4), point(4,4), point(5,4))等。

如果您对occupySpace的调用返回false，则所有点都不匹配，并且您是安全的；如果它返回true，则存在冲突。

这样做的好处是，如果你有x个对象，而不是每次移动检查x*x次，你可以检查x次max。

您不需要传入对象的所有点，只需要传入最外层的点。