0

我正在尝试使用以下方法旋转 SVG <polygon>（或任何其他元素）：

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

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

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

4

1 回答 1

0

问题是您的多边形的旋转中心位于 coord(0,0) > 看点：

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"

因此，如果您在 animate 中使用 (cx,cy) 进行旋转，这些参数也是 animate 的，从 0 到 100 然后再到 0。

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

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

  • 尝试直接在 HTML 或 JS 中创建 SVG
  • 或尝试在导出之前在绘图程序中修改坐标的原点。
于 2012-03-27T19:01:17.757 回答