javascript - 如果您只有使用 JavaScript 的图像数据 url，是否可以旋转图像？

Question

我遇到一个问题，我需要旋转图像，但我只有图像数据 url 可用。

我需要做的是先旋转图像，然后将其加载到 Canvas 中，加载到 Canvas 后无法旋转图像。

如果您只有图像数据网址，是否可以旋转图像。

Answer 1

是的，确实如此。

var canvas = document.createElement('canvas');

canvas.width="1000"; //specify width of your canvas
canvas.height="1000"; //specify height of your canvas
var img = document.createElement("img"); 
img.src = "image.png"; //specify url

var ctx = canvas.getContext("2d");

ctx.rotate(90 * Math.PI/180); // rotate by 90 degrees
ctx.drawImage(img,100,100); //draw it
ctx.fill();
document.body.appendChild(canvas); // display it!