JavaScriptを使ったSVGのSMILの制御

Question

私はこの昆虫のSVGを持っています。この方法以外では不可能でない限り、<img />または<object />というタグを挿入します。

insect.svgには、歩行用と飛行用の2つのアニメーションがあります。

これらのアニメーションを個別に、またはHTMLのJavaScriptから開始/停止したいと思います（または、HTML JavaScriptから埋め込みSVG JS関数 "walk"または "fly"を呼び出す）。

最後に、ゲームプレイ中に私の昆虫を飛ばせたいならば、私はJSでそれを知らせて、それがもう飛ぶべきではないときに止めるよう伝えます。歩くと同じです。

これを行う方法はありますか？私は過去1時間にグーグルで行っており、実際の所見はありませんでした。 IEのサポートが問題であれば気にしません。

ありがとうございました！

Answer 1

SMILアニメーションハイパーリンクを試すことができます。 URLの＃の後に開始したいアニメーションのIDを入れます。たとえば、http://www.w3.org/Graphics/SVG/Test/20061213/htmlObjectHarness/full-animate-elem-21-t.htmlを参照してください。マウスをクリックしてアニメーションを開始すると、URLが変化します。 Firefoxを使用している場合、あなたはそれがこのような何かを行くとJavaScriptでアニメーションを開始したい場合はSMILハイパーリンクは、Firefoxそうでなければ12

ではないとして、あなたは...毎晩が必要になります

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

しかし、これは<img>要素ではスクリプトを使用できないため動作しません。