javascript - 单击可拖动层顶部时如何获得准确的指针位置？

Question

我刚刚开始学习 Kinetic.js，我真的很享受使用 HTML5 使它变得如此简单 <canvas>元素。

我有一个比“舞台”(使用动力学术语)大但可以拖动的大层。拖动功能似乎以两种不同的方式干扰点击处理程序:一些单击没有注册；并且在那些这样做的人中，只有当图层位于其原始位置时，位置才是准确的。

Here's a fiddle显示我遇到的问题。在我的实际代码中，底层实际上是一个图像。

Answer 1

http://jsfiddle.net/EKaAv/1/

layer.on ('click', function(e) {
    console.log(e);
    var mousePos = stage.getMousePosition(); // mouse position relative to stage
    var xclick = mousePos.x;
    var yclick = mousePos.y;
    var circle = new Kinetic.Circle({
        x: xclick - layer.getX(), // since position is relative to stage, adjust by layer X
        y: yclick - layer.getY(), // same as above
        radius: 25,
        fill: 'red',
        opacity: 0.5
    });
    layer.add(circle);
    stage.draw();       // redraw the stage immediately
});

任何似乎未注册的点击都是由于触发了覆盖点击事件的可拖动事件。