动力学js中的碰撞检测+鼠标事件

Question

我正在尝试对许多可拖动的矩形对象进行拖放。

还有另一组 矩形对象 充当放置对象的容器 - 我已将它们添加到 组强>。

1. 如何检测组/或任何框对象（存储在数组中）与可拖动元素之间的碰撞。

一切都在一个层中。

1. 此外，当可拖动元素放置在组框上时，它不会监听鼠标悬停事件（分配给它） - 有没有办法委派事件（mouseover，mouseout ) 当另一个元素拖动到低级对象时。

   box.on("鼠标悬停", 功能（e）{ console.log("mouseover");});

谢谢。

Answer 1

1. 我相信 KineticJS 不支持它自己的碰撞检测，因此您必须编写自己的函数。这 2 个 SO 问题是很好的起点：

   Dragging collisions

   HTML5 / kineticJS getIntersection function implementation

2. 参考这个问题的答案：How to start mouseover event while dragging

   我们看到我们可以在 KineticJS 上进行类似的操作，并且该解决方案与创建您自己的碰撞检测函数密切相关。这里唯一的区别是，您可以计算每个形状（在您的情况下为矩形）的 4 个角点坐标，而不是计算 div 上的命中检测坐标。此外，您可以使用 getMousePos() 和事件：dragstart、dragend 和 mousemove 来重写小提琴示例中的代码并满足您的动态矩形，而不是编写自己的拖动函数。