複雑なアニメーション（SVG版）

プログラム

JavaFXが来るらしいのだが、実は空白の入ったフォルダにインストールしたお陰で
やっとJavaFXのサンプルが動いたぐらいで、GroovyFXは未だ動いていない。
　
ということで、以下のうち手元で動作したのは前者のみ。
　
複雑なアニメーション
http://skrb.hatenablog.com/entry/2012/06/12/233529
複雑なアニメーション（GroovyFX版）
http://d.hatena.ne.jp/ksky/20120613/p1
　
動かして思うことはもっと手抜きできないかなぁということ。
で、アニメーションといえばこれでしょ。
ってことでSVGで組んでみた。（動作確認最新のChromeのみ）

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="400px" height="250px" viewBox="0 0 400 250" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
    <rect id="rect" x="50" y="50" width="100" height="75" fill="red" opacity="0.0">
        <animate attributeName="opacity" begin="0s" dur="0.5s" from="0.0" to="1.0" fill="freeze" repeatCount="1"/>
        <animate attributeName="x" begin="1s" dur="5s" fill="freeze" calcMode="linear" repeatCount="1" keyTimes="0;0.2;0.4;0.6;0.8;1" values="50;250;50;250;50;250"/>
        <animate attributeName="fill" begin="1.5s" dur="2.4s" fill="freeze" calcMode="linear" repeatCount="1" keyTimes="0;0.25;0.5;0.75;1" values="red;green;red;green;red"/>
    </rect>
    <circle id="circle" cx="150" cy="150" r="50" fill="cyan" opacity="0.0">
        <animate attributeName="opacity" begin="2s" dur="0.5s" from="0.0" to="1.0" fill="freeze" repeatCount="1"/>
        <animate attributeName="opacity" begin="5s" dur="0.5s" from="1.0" to="0.0" fill="freeze" repeatCount="1"/>
        <animateTransform attributeName="transform" type="scale" additive="sum" begin="2.5s" dur="2s" fill="freeze" keyTimes="0;0.5;1" values="1,1;2.0,0.75;1,1" repeatCount="1"/>
    </circle>
</svg>

　
エディタにコピペして、拡張子svgで保存したらchromeで開いてみてください。
＃インラインで差し込む方法があれば教えて下さい。