Canvas Kineticjs -鼠标位置错误

Canvas Kineticjs - position mouse is wrong

本文关键字:位置 错误 鼠标 Kineticjs Canvas      更新时间:2023-09-26

首先是文本行然后是canvas
但是鼠标在画布上的位置是错误的(现在y位置为零=文本行高度)
http://jsfiddle.net/dSC26/

<div id="output">output</div>
<div id="container"></div>
yoda.on('mousemove', function(e) {
    $('#output').html('position mouse on canvas: '+'x: ' + e.clientX + ', y: ' + e.clientY); 
});

可以使用event.offsetX/Yevent.layerX/Y属性

点击这里查看-> http://jsfiddle.net/dSC26/2/

yoda.on('mousemove', function(e) {
    var offsetX = e.offsetX || e.layerX,
        offsetY = e.offsetY || e.layerY;
    $('#output').html('position mouse on canvas: '+'x: ' + offsetX + ', y: ' +  offsetY); 
});

使用stage.getMousePosition()。例子:

http://www.html5canvastutorials.com/kineticjs/html5-canvas-path-mouseover/

你也可以使用stage.getTouchPosition()来处理触摸事件,或者使用stage.getPointerPosition()来处理鼠标或触摸事件