javascript - 在 Kinetic.js 中通过多个层处理事件？

Question

我在 layer1 上有一个圆圈，然后在 layer2 上有一个正方形。圆的直径是正方形的宽度，它们的中心相同，圆在正方形的顶部。我该如何设置，以便如果我在 layer1 上触发任何事件，相同的事件将在 layer2 的同一位置执行。所以在这种情况下，如果我点击圆形，也会触发方形的点击事件。当然，这并不意味着我只是想将圆圈的事件连接到正方形的事件，而是我基本上希望在两层都触发事件。

例如，如果

circle.on( "click", function() {
    alert("foo");
});

square.on( "click", function() {
    alert("bar");
});

然后点击圆心应该触发方形点击事件。

而不是通过

circle.on( "click", function() {
    alert("foo");
    square.simulate("click"); // don't want this
});

Answer 1

如何将圆形和方形添加到组中，然后将点击事件附加到组中？

Answer 2

Kinetic 有两件事可以帮助您。

1. getIntersections() -- 返回鼠标点击点下的所有形状
2. fire() -- 触发一个事件

Kinetic 文档提到 getIntersections() 执行速度很慢，所以他们更喜欢 getIntersection()，但我从来没有使用过，所以我不能说多少。

http://kineticjs.com/docs/Kinetic.Stage.html#getIntersection

希望这可以帮助。