使用JavaScript控制SVG的SMIL

Question

假设我拥有这种昆虫的SVG。除非这种方式不可行，否则我想将其作为<img />或<object />标签插入。

现在，insect.svg有两个动画：一个用于散步，另一个用于飞行。

我想单独地从HTML的JavaScript开始/停止这些动画（或者从HTML JavaScript中调用一个嵌入的SVG JS函数“walk”或“fly”）。因此，如果在游戏过程中，我希望我的昆虫能够飞行，那么我可以通知它使用JS来做到这一点，并告诉它在它不应该飞行时停止。和走路一样。

有没有办法做到这一点？我一直在谷歌搜索过去一小时，并没有真正的发现。 如果这是一个问题，我不关心IE支持。

谢谢你的时间！

Answer 1

您可以尝试使用SMIL动画超链接。你在URL后面加上你想要开始的动画的id。例如，请参阅http://www.w3.org/Graphics/SVG/Test/20061213/htmlObjectHarness/full-animate-elem-21-t.html - 当单击鼠标并启动动画时，URL会更改。如果你使用Firefox，你需要在夜间为SMIL超链接是不是在Firefox 12

否则，如果你想开始用JavaScript它会去像这样的动画...

var svgDocument = document.getElementById("objectId>").getSVGDocument(); 
svgDocument.getElementById('<animationElementId>').beginElement(); 

但是这不适用于<img>元素，因为它不允许脚本。