在Kinetic.js中通过多层处理事件

Handle events through multiple layers in Kinetic.js?

本文关键字：处理事件 Kinetic js      更新时间：2023-09-26

我在第1层上有一个圆圈，然后在第2层上有个正方形。圆的直径是正方形的宽度，它们的中心是相同的，圆在正方形的顶部。我该如何设置，以便如果我在第1层触发任何事件，则在第2层的相同位置执行相同的事件。所以在这种情况下，如果我点击圆圈，方块的点击事件也会被触发。当然，这并不意味着我只是想把圆圈的事件与广场的事件联系起来，而是我基本上希望事件在两层上都被触发。

例如，如果

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
});

将圆形和方形添加到一个组中，然后将单击事件匹配到该组中，怎么样？

Kinetic有两件事可以帮助您。

  1. getIntersections（）--返回鼠标单击点下的所有形状
  2. fire（）--引发事件

Kinetic文档提到getIntersections（）执行缓慢，所以他们更喜欢getIntersection（），但我从来没有用过，所以我不知道用了多少。

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

希望这能有所帮助。

相关文章：