javascript - 我如何将 'forward'(鼠标)事件发送到 kineticjs 中较低 Zindex 上的节点/形状

Question

我正在使用 kineticjs，其中有一个包含一层的舞台。该层上有多个形状，它们对鼠标悬停事件使用react(它们显示工具提示)除了这些形状之外，我还在更高的 ZIndex 上有一些文本节点(因此它们在形状之上)。

除了一个异常(exception)，这一切都很好，当文本位于形状之上时，形状不显示工具提示我认为这是因为文本节点使用事件，而不是“转发”它，尽管我没有'没有将任何内容绑定(bind)到文本节点。

如何将事件传播到较低 ZIndex 上的节点？

Answer 1

我个人会创建一个单独的层来放置任何您不想在其上注册鼠标事件的东西，并且在创建层时将其 listening 属性设置为 false。
您还可以为各个元素设置此属性。
这是一个使用图层的示例...

var stage = new Kinetic.Stage({
    container: 'container',
    width: 578,
    height: 200
});

var normalLayer = new Kinetic.Layer();
var textLayer = new Kinetic.Layer({listening :false});

var rect = new Kinetic.Rect({
    x: 20,
    y: 20,
    width: 100,
    height: 50,
    fill: 'green',
    stroke: 'black',
    strokeWidth: 4
});

rect.on('click', function(evt) {
    this.setFill('blue');
    normalLayer.draw();
});

normalLayer.add(rect);

var simpleText = new Kinetic.Text({
        x: 40,
        y: 40,
        text: 'Simple Text',
        fontSize: 30,
        fontFamily: 'Calibri',
        textFill: 'yellow'
      });

textLayer.add(simpleText);

stage.add(normalLayer);
stage.add(textLayer);

http://jsfiddle.net/MT435/
请记住，也可以为单个元素设置 listening 属性。