顺时针旋转图像&逆时针方向


Rotate an image in clockwise & Anti Clockwise direction

我已经使用http://raphaeljs.com/image-rotation.html拉斐尔的脚本,但是。如何保存这个旋转图像

这是一个SVG,而不是真正的图像。

您必须通过AJAX将生成的SVG保存到服务器上,并使用外部SVG渲染库进行渲染。

你可以试试librsvg2-bin,因为我听说它是有效的。

如前所述,它是一个SVG元素,它使用源图像来更改点击旋转按钮时的角度。通过检查旋转后的图像,您将看到如下的SVG元素:

<image x="160" y="120" width="320" height="240" preserveAspectRatio="none" href="http://raphaeljs.com/bd.jpg" transform="rotate(-90, 320, 240)"/>

您将注意到有一个包含rotate(angle, x, y)函数的tranform属性。如果你能找到一种方法来获得这个角度值,你可以使用它来操作图像源,通过使用imagerotate函数使用PHP生成一个新的图像。

通过这样做,我得到了transform属性值:

document.getElementById('holder').getElementsByTagName('image')[0].getAttribute('transform')

返回"rotate(-90, 320, 240)"

p