Question

我在div中有一个画布，如果它变大，它可以向右/向左滚动。我需要获得画布上的点击坐标。我已经尝试过很多我见过的不同的东西，但没有什么能给我正确的坐标。我在画布上有一个矩形，当我点击一个设定坐标的矩形时。＆＃34;点击＆＃34;坐标不是它们应该是x坐标是100px短。有人能指出我正确的方向吗？

HTML：

<div id="cv">
<canvas id="canvas" width="30000" height="600"></canvas>
</div>

CSS：

<style>
#cv{
   display: block;
   width: 1500px;
   height: 500px;
   overflow: auto;
}

<script>
canvas.addEventListener("mousedown", doMouseDown, false);
function doMouseDown(event){
var totalOffsetX = 0;
var totalOffsetY = 0;
var canvasX = 0;
var canvasY = 0;
var currentElement = this;
do{
    totalOffsetX += currentElement.offsetLeft - currentElement.scrollLeft;
    totalOffsetY += currentElement.offsetTop - currentElement.scrollTop;
}
while(currentElement = currentElement.offsetParent)
canvasX = event.pageX - totalOffsetX;
canvasY = event.pageY - totalOffsetY;
}
</script>

Answer 1

我只是使用鼠标跟随功能，如果有一个点击它采取的坐标。这不是我想要它去，但似乎工作正常。

在DIV内的画布上获取Click Coordinates

1 个答案: