dynamicjs中的碰撞检测+鼠标事件

Question

我试图做一个数字 ，可以拖动 矩形对象 拖放 。

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

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

一切都在单层中。

1. 同样，当将可拖动元素放置在组框上时，它不会侦听（分配给它的）鼠标悬停事件- 当另一个元素存在时，有一种方法可以将事件（mouseover，mouseout）委托给低级对象拖过去。

   box.on（“ mouseover”，function（e）{console.log（“ mouseover”）;}）;

谢谢。

Answer 1

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

   拖动碰撞

   HTML5 / dynamicJS getIntersection函数实现

2. 引用此问题的答案： 如何在拖动时启动mouseover事件

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