在Kinetic.Line上检测鼠标事件

时间:2014-02-19 13:28:04

标签: html5-canvas kineticjs

我试图在Kinetic.Group上检测包含由Kinetic.Line's

组成的网格的鼠标事件(当前是mousedown)

我正在听Layer上的mousedown事件。当碰到一条线时,没有事件被触发。

var grid = new Kinetic.Group({
    x: 0,
    y: 0,
    width: this.group.width(),
    height: this.group.height()
});

grid.on("mousedown", function(){
    alert("At least this one should fire!");
});

var gridX = this.gridWidth, gridY = this.gridHeight;

this.group.add(grid);

while(gridY < this.rect.height()){          

    var line = new Kinetic.Line({
        points : [0,gridY, this.rect.width(), gridY],
        stroke: "grey",
        strokeWidth: 1
    });

    grid.add(line);

    gridY += this.gridHeight;
}

while(gridX < this.rect.width()){           
    var line = new Kinetic.Line({
        points : [gridX,0, gridX, this.rect.height()],
        stroke: "grey",
        strokeWidth: 1
    });

    grid.add(line);

    gridX += this.gridWidth;
}

我找到了这篇文章:

Kinetic.Line mouseover

提到的答案是使用&#34; saveData()&#34;在形状上。这似乎很旧,因为Kinetic.Shape中不存在此方法。

上述帖子指向的示例是图像。它使用cache()方法创建一个命中图或其他东西。我尝试过我的线路,但这也不起作用。

如何在Kinetic.Line上简单地检测鼠标事件?

1 个答案:

答案 0 :(得分:0)

万一你还在寻找这个@Chris的答案,如果其他人找到了你的帖子,我相信你和我都遇到了同样的问题。 @Sjiep如此慷慨地在this线程下为我的问题提供了修复。

原来这确实是一个错误!