从 html canvas 到 javascript/jquery，如何修复此鼠标 x/y 故障？
Drawing on html canvas through javascript/jquery, how do I fix this mouse x/y glitch?
我一直在寻找这个问题的答案，但我不知道我做错了什么...
这是我第一次尝试在空闲时间做这样的事情，这样我就可以利用我学到的知识为我的公司构建一个实际的工具。
被引用的代码在 github，此处：My Github Repo
抱歉，我没有将它托管在任何地方进行实时测试。如果有人知道在哪里可以更轻松地回答这个问题，请告诉我。
在任何情况下，它都会创建一个 canvas，使用 javascript 绘制缩放到 canvas 的地图图像，并在您单击 [=25] 时绘制一个矩形=].但出于某种原因，除非您单击 0,0，否则我无法弄清楚为什么矩形不会直接绘制在光标上。您单击的更右或向下会有某种附加偏移。我试过检查控制台中的事件数据并在网上到处搜索可能导致它的原因，但我不知道。
如果您有任何建议，我将不胜感激！谢谢！
请注意，您在 CSS 中缩放 canvas，因此其坐标不再与屏幕坐标匹配。
将 CSS 更改为
时
canvas {
width: 800px; /* same as the HTML attribute */
height: 600px; /* same as the HTML attribute */
}
可以这样计算坐标：
var posx = e.pageX - position.left, posy = e.pageY - position.top;
我一直在寻找这个问题的答案，但我不知道我做错了什么...
这是我第一次尝试在空闲时间做这样的事情，这样我就可以利用我学到的知识为我的公司构建一个实际的工具。
被引用的代码在 github，此处：My Github Repo 抱歉，我没有将它托管在任何地方进行实时测试。如果有人知道在哪里可以更轻松地回答这个问题，请告诉我。
在任何情况下，它都会创建一个 canvas，使用 javascript 绘制缩放到 canvas 的地图图像，并在您单击 [=25] 时绘制一个矩形=].但出于某种原因，除非您单击 0,0，否则我无法弄清楚为什么矩形不会直接绘制在光标上。您单击的更右或向下会有某种附加偏移。我试过检查控制台中的事件数据并在网上到处搜索可能导致它的原因，但我不知道。
如果您有任何建议，我将不胜感激！谢谢！
请注意，您在 CSS 中缩放 canvas，因此其坐标不再与屏幕坐标匹配。
将 CSS 更改为
时canvas {
width: 800px; /* same as the HTML attribute */
height: 600px; /* same as the HTML attribute */
}
可以这样计算坐标：
var posx = e.pageX - position.left, posy = e.pageY - position.top;