canvas在舞台上点击后图片旋转_javascript canvas 如何对图片进行绕中心点旋转

可以使用以下代码实现对图片绕中心点旋转：

// 获取图片对象
var img = document.getElementById('img');

// 设置旋转角度
var angle = 45;

// 将画布的原点移动到图片中心
ctx.translate(img.width / 2, img.height / 2);

// 旋转图片
ctx.rotate(angle * Math.PI / 180);

// 绘制图片
ctx.drawImage(img, -img.width / 2, -img.height / 2);

上述代码中，首先获取图片对象，然后设置旋转角度。接下来通过 `translate` 方法将画布原点移动到图片中心，再通过 `rotate` 方法对图片进行旋转。最后使用 `drawImage` 方法将旋转后的图片绘制到画布上。

需要注意的是，旋转角度需要转换成弧度制，即需要将角度乘以 `Math.PI / 180`。同时，绘制图片时需要将图片的位置从左上角调整到中心位置，即将 `drawImage` 方法中的 `x` 和 `y` 坐标都减去图片宽度和高度的一半。