Question

我的画布旋转缓慢有问题。我需要旋转在画布上绘制的img，但是在我的项目中，图像可能比画布大，并且无法完全显示。

因此，我在src中有图像base64，应该将其绘制在画布上，并通过在90 deg上单击按钮来旋转它。我应该旋转所有图像（不仅是显示在画布上的那一部分），然后创建新的canvas元素，在其上绘制图像（此画布的大小为img）并旋转它，然后再将图像从画布保存到全局变量，然后在第一个画布上再次绘制它。

var shadowCanvas = document.createElement("canvas");
var ctxShadow = shadowCanvas.getContext("2d");
var img = CANV_DATA.currentImg;
shadowCanvas.height = img.width;
shadowCanvas.width = img.height;
ctxShadow.rotate(Math.PI / 2);
ctxShadow.drawImage(img, 0, -img.height);

var img2 = new Image();
img2.src = shadowCanvas.toDataURL();
img2.onload = function() {
  CANV_DATA.currentImg = img2;
  drawImg(CANV_DATA.currentImg.src, true, CANV_DATA.currentId);
};

一切正常，但是在显示大图片时效果很慢（1秒）如何解决？

画布缓慢旋转

0 个答案: