有没有办法使用javascript单击画布中的特定点/元素

Question

如何在画布中的特定位置应用单击？ （使用坐标对我来说似乎是最合乎逻辑的，但找不到任何方法来做到这一点，欢迎任何其他想法）。请注意，我无权访问创建画布的代码。

编辑：一些澄清，画布上有多个正在绘制的元素，我无法选择但需要单击它们。我可以手动找到它们的坐标并进行一些计算，但是每次我尝试将单击或鼠标事件传递到该位置时，都不会被视为真正的鼠标单击（应该单击的按钮不是）。

我尝试使用 x y 坐标，但它不能模拟点击，我还要求聊天 gpt 给我写一些监听点击并模拟它的东西，但它也不起作用。

Answer 1

您可以通过鼠标事件来解决这个问题，就像您可能尝试过的那样。

这是一个例子：

---

var canvas = document.getElementById('your-canvas-id');

// Change the numbers to your desired coordinates
var x = 100;
var y = 200;

var clickEvent = new MouseEvent('click', {
  clientX: x,
  clientY: y,
});

canvas.dispatchEvent(clickEvent);

---

如果这不起作用，则说明您的坐标有问题，或者您的画布 ID 不匹配。

Answer 2

你尝试过这个吗？

let canvas = document.querySelector('canvas')
let x = 100 // or whatever
let y = 100 // or whatever
canvas.dispatchEvent(new MouseEvent('mousedown', {
  clientX: x,
  clientY: y,
  bubbles: true
}))
canvas.dispatchEvent(new MouseEvent('mouseup', {
  clientX: x,
  clientY: y,
  bubbles: true
}))