Canvas KineticJS Container.getCrossors速度非常慢

我需要在我的HTML5画布中检测碰撞（我使用的是KineticJS库），到目前为止，我使用自己的方法来检测某个点是否在某个形状内

我最近注意到容器类中有一个方法，getcrossions（point），它应该完全满足我的要求。但是，它似乎非常慢，因此当在画布上移动对象并对每个新位置使用该方法时，它将变得不可用

---

是否有人使用这种方法进行碰撞检测？如果没有，是否有关于HTML5画布中冲突检测的提示？我很难检测出一个点是否在旋转了一定角度的矩形内

我也注意到同样的事情，获取交叉点需要很长时间。它也被称为鼠标事件等，这使得它更糟

---

我不知道如何使它更快，但有一件事对速度有很大影响，那就是你在舞台上有多少形状。因此，加快速度的一种方法是在不需要的时候删除不必要的形状，并在需要的时候动态地将它们带回来。

我在手机游戏（模拟空中交通管制）中使用了getcrossion（）考虑到它被多次调用以检测游戏框架中所有现有飞机之间的碰撞，它工作得非常好。如果您只需要检测一个特定点，一个可能的解决方案是为该位置添加一个非常小的虚拟矩形，并获取与之相交的所有对象的列表，然后在该列表上迭代。命名感兴趣的对象可以加快条件验证。

这正是你需要的

好的，很清楚，有两种方法可以得到一个相交的形状 根据鼠标位置：

1） getcrossion（）-首选2）getcrossions（）-非常慢， 并应用于特殊情况

getIntersection（）方法速度非常快，返回一个对象 包含关于交点的信息，例如 引用KineticJS形状（如果有）或像素颜色 信息

getcrossions（）方法做同样的事情，只是 按顺序遍历并重新绘制阶段中的每个节点 返回可能已分层的交叉点集合的步骤 一个接一个

100次中有99次，你可能只是对可见的事物感兴趣 位于其下方节点顶部的相交节点

实际上，我考虑过删除getcrossions（）方法 完全，但没有，因为有一些特殊情况 实际上，您确实需要一组交叉点。在这个时候，我 尽管如此，我还是没能找到一种加速的方法 我会继续调查的

---

谢谢你的反馈。事实上，我已经在图层中尝试了一个其他形状，但它仍然会使应用程序的速度减慢到无法使用的程度。这是正确的吗？我假设在鼠标上使用GetCrossons，而且速度很快（参见）@Jonke我的评论基于这样一个事实：当我对我的kineticjs项目运行Chrome profiler查看它在哪里使用CPU时间时，它说Kinetic.Stage.GetCrossion占46%！当我点击打开它以查看它的使用位置时，它会显示三个位置：Kinetic.Stage.\u mousemove、\u mousedown和\u mouseup。Mousemove占用了45%的cpu时间，所以基本上所有的getIntersection都需要cpu时间。@是的，getIntersection确实需要cpu时间，但它需要的cpu时间是否比它应该需要的更多？（又名慢代码）？我认为OP使用getIntersection进行自制冲突检测，也许他应该在鼠标[move]上覆盖当前行为，这样他就不会多次触发getIntersection。@Jonke根据这一点，是的，它会：。你能做一个示例代码吗？我在动画中使用了10000多个形状，使用鼠标悬停并不慢。我确实使用过许多不同的层，将鼠标事件放置在层上，并将不同的形状放入不同的层中。（kineticjs 4.1.2版）