相对指针位置

时间:2013-03-27 11:07:47

标签: javascript canvas kineticjs

我需要一些帮助来弄清楚如何计算KineticJS阶段的相对指针位置。

就我而言,我的舞台会更改positionoffsetscale

以下是演示:http://jsfiddle.net/pCZzv/

function getRelativePointerPosition() {
    var pointer = stage.getPointerPosition();
    var pos = stage.getPosition();
    var offset = stage.getOffset();
    var scale = stage.getScale();

    return {
        x : ((pointer.x - pos.x + offset.x) / scale.x),
        y : ((pointer.y - pos.y + offset.y) / scale.y)
    };
}

我希望红色圆圈出现在单击鼠标的位置。 当舞台改变它的偏移和缩放时,我遇到了问题。

1 个答案:

答案 0 :(得分:6)

xy坐标的计算略有偏差。这是您的示例的工作演示:http://jsfiddle.net/pCZzv/1/

以下是相关的更改代码:

function getRelativePointerPosition() {
    var pointer = stage.getPointerPosition();
    var pos = stage.getPosition();
    var offset = stage.getOffset();
    var scale = stage.getScale();

    return {
        x : ((pointer.x / scale.x) - (pos.x / scale.x) + offset.x),
        y : ((pointer.y / scale.y) - (pos.y / scale.y) + offset.y)
    };
}