javascript - 如何在 Canvas 中查找坐标

标签 javascript canvas coordinate

我有一张拉斐尔论文,我想找到相对于我的论文的坐标

我的html:

<div style='width:100%;'>
  <div id='mycanvas' class='canvas'></div>
</div>

我的Javascript:

var mypaper = Raphael(mycanvas, '100%', '100%');
...
document.getElementById('mycanvas').onmouseover=function(event) {
    var canvasPos = {
        x: this.offsetLeft,
        y: this.offsetTop
    };
    var coord = {
        x: event.pageX-canvasPos.x,
        y: event.pageY-canvasPos.y
    };
};

我希望 mypaper 左上角的 coord.xcoord.y 为零,但事实并非如此

最佳答案

最后,我找到了一个answer

function getCursorPosition(canvas, event) {
var rect = canvas.getBoundingClientRect();
var x = event.clientX - rect.left;
var y = event.clientY - rect.top;
console.log("x: " + x + " y: " + y);

}

关于javascript - 如何在 Canvas 中查找坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44553649/

相关文章:

javascript - 如果语句双 json_encode 返回未定义值,Ajax jQuery 成功

php - 对变量求和并不断显示和更新它

javascript - 下载多个 dataURL 文件

c - 索引转换 : row-major to cartesian coordinates (e. g.,像素)

iOS:自增 NSString

geometry - 将坐标从一个三角形转移到另一个三角形

javascript - 了解 Backbone.js 概念

javascript - 像优步一样滑动子菜单

javascript - Html 你能从 javascript 运行 css 代码吗?

javascript - Canvas 与矩形的碰撞