向 Canvas 元素添加单击事件处理程序以返回单击的 x 和 y 坐标(相对于 Canvas 元素)的最简单方法是什么?
无需兼容旧版浏览器,Safari、Opera 和 Firefox 即可。
最佳答案
如果您喜欢简单但仍需要跨浏览器功能,我发现此解决方案最适合我。这是@Aldekein 解决方案的简化,但没有 jQuery。
function getCursorPosition(canvas, event) {
const rect = canvas.getBoundingClientRect()
const x = event.clientX - rect.left
const y = event.clientY - rect.top
console.log("x: " + x + " y: " + y)
}
const canvas = document.querySelector('canvas')
canvas.addEventListener('mousedown', function(e) {
getCursorPosition(canvas, e)
})
关于javascript - 如何获取鼠标单击 Canvas 元素的坐标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55677/