动画SVG路径数据

Question

我正在尝试使用jQuery为SVG的路径数据属性设置动画。

目前，我已经创建了SVG，并存储了两个路径，并带有一个添加animate元素的按钮。

当我直接改变属性（由第一个svg显示）时，我取得了成功，尽管动画不会改变第二个svg上的任何内容。

$('.svg2 svg path').append('<animate attributeName="stroke-dasharray" from="'+OrigPath+'" to="'+NewPath+' dur="4" repeatCount="1">');

任何帮助都会很棒。这是小提琴：http://jsfiddle.net/vB8tu/1/

Answer 1

使用类似的jQuery添加元素不起作用。这是因为jQuery使用HTML命名空间来表示新元素，而不是SVG。

您需要使用jQuerySVG之类的东西来创建和添加新元素。