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

时间:2011-04-28 04:12:32

标签: php javascript html image-rotation rotateanimation

我使用了http://raphaeljs.com/image-rotation.html raphel的剧本但是。如何保存此旋转图像。

2 个答案:

答案 0 :(得分:0)

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

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

您可以尝试librsvg2-bin,因为我听说它有效。

答案 1 :(得分:0)

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

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

您会注意到tranform属性包含rotate(angle, x, y)功能。如果您可以找到获取该角度值的方法,则可以使用它来操纵图像源,以使用PHP使用imagerotate函数生成新图像。

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

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

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

当然这是一个黑客; p