如何在画布上获得鼠标单击事件的正确位置

Question

我有画布：

Canvas = function(){ //v1.0
  var o = this;
  (o.penPos = {x: 0, y: 0}, 
   o.pixelSize = 10, 
   o.pen = {style: "solid", size: 1, color: "#000"}, 
   o.brush = {style: "solid", color: "#000"});
};

我在点击事件中执行以下操作：

document.onclick = function(e){
  canvas.pixel(e.x, e.y);
}

但它没有显示坐标的正确位置，我不知道出了什么问题，因为我不熟悉UI设计。

Answer 1

如果您要收听所需的document点击次数：

event.offsetX 
event.offsetY

获取相对于canvas元素的坐标。您还需要检查目标元素是否是感兴趣的画布元素。

你可能最好不要在canvas元素上点击。