我需要检测我的 HTML5 画布中的碰撞（我正在使用 KineticJS 库），到目前为止，我已经使用我自己的方法来检测某个点是否在某个形状内。
我最近注意到 Container 类中有一个方法 getIntersections(point) 应该完全符合我的要求。但是，它似乎非常慢，因此当在画布上移动对象并为每个新位置使用该方法时，它变得无法使用。
有没有人使用这种方法进行碰撞检测？如果没有，是否有任何关于 HTML5 画布中碰撞检测的提示？我无法检测一个点是否在一个旋转一定度数的矩形内。
问问题
1237 次
3 回答
1
我注意到了同样的事情，getIntersections 需要很长时间。它也被称为鼠标事件等，这使得情况变得更糟。
我不知道如何使它更快，但是会显着影响速度的一件事是您在舞台上拥有的 Shapes 数量。因此，加快速度的一种方法是在不需要时删除不必要的 Shapes，并在需要时动态地将它们带回来。
于 2012-11-30T11:02:05.810 回答
1
我在手机游戏（空中交通管制的模拟）中使用了 getIntersection()，它工作得很好，因为它被多次调用以检测游戏框架中所有现有飞机之间的碰撞。如果您只需要检测一个特定点，一种可能的解决方案是为该位置添加一个非常小的虚拟矩形，并获取与其相交的所有对象的列表并遍历该列表。命名感兴趣的对象可以加快您的条件验证。
于 2012-12-04T23:05:22.707 回答
1
https://github.com/ericdrowell/KineticJS/issues/150
这正是您所需要的。
好的，要清楚，有两种方法可以根据鼠标位置获得相交的形状：
1) getIntersection() - 首选 2) getIntersections() - 非常慢，应该用于特殊情况
getIntersection() 方法速度极快，并返回一个包含有关交点信息的对象，例如对 KineticJS 形状的引用（如果存在）或像素颜色信息。
getIntersections() 方法做同样的事情，除了它迭代并重绘舞台中的每个节点，以返回可能已经分层的交叉点的集合。
100 次中有 99 次，您可能只对位于其下方节点顶部的可见相交节点感兴趣。
实际上，我已经考虑过完全删除 getIntersections() 方法，但没有考虑过，因为在某些特殊情况下，您确实需要交叉点的集合。目前，我还没有找到加快 getIntersections 的方法，尽管我会继续研究它。
于 2014-02-13T07:38:47.587 回答