是否尝试在JavaScript画布上按鼠标指针的方向旋转图像？

// 获取画布元素
const canvas = document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');

// 创建图像对象
const image = new Image();
image.src = 'image.jpg';

// 监听鼠标移动事件
canvas.addEventListener('mousemove', rotateImage);

// 旋转图像函数
function rotateImage(event) {
  // 清空画布
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  
  // 计算鼠标指针相对于画布中心的位置
  const mouseX = event.clientX - canvas.offsetLeft - canvas.width / 2;
  const mouseY = event.clientY - canvas.offsetTop - canvas.height / 2;
  
  // 计算旋转角度
  const angle = Math.atan2(mouseY, mouseX);
  
  // 保存画布状态
  ctx.save();
  
  // 平移到画布中心
  ctx.translate(canvas.width / 2, canvas.height / 2);
  
  // 旋转画布
  ctx.rotate(angle);
  
  // 绘制图像
  ctx.drawImage(image, -image.width / 2, -image.height / 2);
  
  // 恢复画布状态
  ctx.restore();
}