canvas 图片旋转

可以使用 Canvas API 中的 `rotate()` 方法来旋转图片。下面是一个简单的例子：

<canvas id="myCanvas"></canvas>

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");

const img = new Image();
img.src = "path/to/image.png";
img.onload = () => {
  const x = canvas.width / 2;
  const y = canvas.height / 2;
  const angle = 45 * Math.PI / 180; // 旋转角度，这里是 45 度
  ctx.translate(x, y);
  ctx.rotate(angle);
  ctx.drawImage(img, -img.width / 2, -img.height / 2);
};

这段代码将在画布中心绘制一张图片，并将其旋转 45 度。可以通过调整 `angle` 变量来改变旋转角度。注意，旋转是以画布中心为基准进行的，因此需要先使用 `translate()` 方法将坐标系移动到画布中心。另外，`drawImage()` 方法的第一个参数为要绘制的图片对象，第二个和第三个参数为图片的左上角坐标，这里使用了负数来使图片居中。