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

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

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

您最好听听对画布元素本身的点击。