javascript - 图像旋转和 Jcrop.js

Question

我需要先旋转一个图像，然后用这个图像旋转调用 Jcrop。问题是，如果我在调用 Jcrop 时使用 css 属性或类似属性旋转图像，则旋转图像总是使用原始属性进行裁剪。

请问有什么帮助吗？

Answer 1

如果图像没有CORS（跨源请求）问题（即图像与网页位于同一域中，或者您可以控制图像所在的域并放置Access-Control-Allow-Origin图像上的标题），然后您可以在使用 JCROP 之前在画布上旋转图像。

var canvas = document.getElementById('canvas1');
var ctx = canvas.getContext('2d');
var img = document.getElementById('image1');
ctx.translate(canvas.width/2,canvas.height/2);
crx.rotate(180*Math.PI/180);
ctx.drawImage(img, -cache.width / 2, -cache.height / 2);