Jquery SVG转换奇怪的行为

Question

我正在尝试使用它来旋转SVG <polygon>（或任何其他元素）：

var svg = new $.svg._wrapperClass($('#test'));
$(svg._svg).animate({svgTransform: 'rotate(720,100,100)'}, 2000);​

多边形确实改变了它的角度，但是有一些奇怪的移动轨迹。 请转到此链接查看：http://jsfiddle.net/ExaBP/

我的目标是让多边形围绕其中心旋转。

Answer 1

问题在于多边形的旋转中心位于坐标（0,0）＆gt;看看要点：

points="38.8313,102.22 42.1242,104.613 45.4171,107.005 44.1593,110.876 42.9015,114.747 38.8313,114.747 34.7611,114.747 33.5034,110.876 32.2456,107.005 35.5384,104.613"

因此，如果您在动画中使用（cx，cy）进行旋转，则这些参数也是动画，从0到100再到0。

您必须在动画之前和之后更改中心。

但是在这里，我认为你需要一个不同的approch：

• 尝试直接在HTML或JS中创建SVG
• 或尝试在导出前修改绘图程序中coordonates的来源。