无需锚标记即可使图像可点击

context.drawImage(imageElement, x, y);

const imageWidth = imageElement.width;
const imageHeight = imageElement.height;
const canvasWidth = canvas.width;
const canvasHeight = canvas.height;

const x = mouseX;
const y = mouseY;

context.drawImage(imageElement, x, y, imageWidth, imageHeight, 0, 0, canvasWidth, canvasHeight);

canvas.addEventListener('mousedown', (event) => {
  const mouseX = event.clientX;
  const mouseY = event.clientY;
  isDrawing = true;
});

canvas.addEventListener('mousemove', (event) => {
  if (isDrawing) {
    const mouseX = event.clientX;
    const mouseY = event.clientY;
    context.drawImage(imageElement, mouseX, mouseY, imageWidth, imageHeight);
  }
});

img {
  transform: scale(1);
  transform-origin: center;
}

img:hover {
  transform: scale(1.5);
  transform-origin: center;
}