碰撞检测不规则形状

时间:2012-07-06 18:47:52

标签: javascript jquery html5 canvas collision-detection

我知道如何检查一个圆是否要与一个正方形碰撞,我知道如何检测一个正方形是否要与一个正方形碰撞,但我如何检测一个多边形是否即将发生碰撞有一个正方形?

或者更好的是,当多边形即将与多边形碰撞时。

或者更好的是,当由不直的线组成的形状与另一个相似的形状,多边形或圆/矩形碰撞时

是否有任何方法可以获得一个形状占用的像素,而另一个形状的像素会占用并检查它们是否相同?

我希望有一些解决方案不需要大量的形状特定计算。

我正在使用javascript和html5画布来执行此操作。

2 个答案:

答案 0 :(得分:3)

这不是一件简单的事情。如果您对一个函数可以判断两个多边形是否发生碰撞(并且您可以回滚它们)感到满意,那么解决方案就不那么难了。您只需要检查多边形的两个边是否相互交叉。这可以通过一些数学来完成,并且对于大的形状或很多的多边形,它可以吞噬性能。要解决此问题,您可以使用空间分区和边界卷。

<强>更新 您可以根据this计算线的交点。然后你需要检查这个点是否在两个段中。为此,您可以使用段的端点,如果段实际包含该点,则ua和ub变量将介于0-1之间。

答案 1 :(得分:0)

最简单的方法是使用边界框,只需找到对象的分钟和最大值,然后从中创建一个方框。要将多边形设置为多边形,您需要一种方法来存储多边形的边缘,并使用另一种方法来确定哪些点或边缘与另一个对象相撞。然后,您可以从此处确定如何对碰撞作出反应。

边界框易于实现,但不是很准确。使用多边形本身的实际边缘更准确但更难以处理并且速度更慢。