旋转画布JS

将其转换为图像后，我有一个canvas我转换成像这样一个形象，旋转画布JS

var can = document.getElementById('canvas'); 
var ctx = can.getContext('2d'); 
var img = new Image(); 
img.src = can.toDataURL();

我现在需要旋转该图像？可能吗？

来源

2017-02-21 Usama Rehan

对不起，我不认为这是重复的。我需要在js中完成，而不是在CSS中完成。因为在完成旋转时我将图像传输到新窗口。 –

第二个答案（http://stackoverflow.com/a/29398757/1693593）画布大小反映相对于旋转，可能是你想要的情况。 – K3N

解决它谢谢:) –

你需要创建一个新的画布，旋转它的2dDrawingContext，画出你的图像数据，然后设置为源

var canvas = document.createElement('canvas'); 
var ctx2 = canvas.getContext('2d'); 
ctx2.rotate(Math.PI/2); 
ctx2.putImageData(ctx.getImageData(0, 0, ctx.canvas.width, ctx.canvas.height), 0, 0);

从那里，你可以调用ctx2.toDataURL()和图像拍它。

来源

2017-02-21 14:56:08 Kyle

回答

相关问题