Javascript在画布上模拟鼠标移动事件答案

【问题标题】：Javascript simulate mouse move event on canvasJavascript在画布上模拟鼠标移动事件
【发布时间】：2019-02-08 08:05:30
【问题描述】：

嘿，我想知道是否有人可以帮助我模拟鼠标移动事件我一直在尝试模拟鼠标从窗口内部宽度和高度移动到画布上的对象 x,y 位置。我可以获取对象位置，但是当我尝试模拟鼠标从窗口中心移动到对象时，它偏离了对象位置，有什么想法会发生这种情况吗？

function moveMouse(x, y) {
  var centerX = window.innerWidth / 2;
  var centerY = window.innerHeight / 2;
  document.dispatchEvent(new MouseEvent("mousemove", {
    clientX: centerX + x,
    clientY: centerY + y
  }));
}

function getObj() { 
  var obj = Game.currentGame.world.localPlayer.entity; 
  return obj
}

var obj = getObj();
var objPosition = {
  x: obj.fromTick.position.x,
  y: obj.fromTick.position.y
}

console.log(objPosition) // works 

moveMouse(objPosition.x, objPosition.y)

对不起，英语不好

【问题讨论】：

Trigger mousemove event using Jquery or Javascript的可能重复
objPosition.x, objPosition.y 的坐标是相对于画布左上角的吗？

标签： javascript

【解决方案1】：

如果objPosition.x, objPosition.y 是画布上对象相对于画布左上角的坐标，那么您的mouseMove() 函数应将x, y 添加到画布左上角的坐标中，而不是窗口中心的坐标。

您可以通过canvas.getBoundingClientRect()获取画布坐标。

或者，如果objPosition.x, objPosition.y 是对象相对于窗口左上角的绝对坐标，则只需将mouseMove() 直接指向它们。

【讨论】：