SVGのanimateにおけるbegin属性

SVG

animateをjsから動的につくってアニメーションさせる場合、

<button>go</button>
<svg>
<circle cx="200" cy="200" r="50" fill="red" id="c"/>
</svg>
<script>
document.querySelector("button").addEventListener("click", function() {
    var c = document.getElementById("c");
    var animate = document.createElementNS('http://www.w3.org/2000/svg', 'animate');
    animate.setAttribute('attributeType', 'XML');
    animate.setAttribute('attributeName', 'r');
    animate.setAttribute('from', 50);
    animate.setAttribute('to', 200);
    animate.setAttribute('dur', '1s');
    animate.setAttribute('fill', 'freeze');
    c.appendChild(animate);
    animate.beginElement();
}, false);
</script>

これでちゃんとできてたんだけど、今Chrome13で見たら、animateをつくった瞬間からアニメーションがはじまってて期待通りに動いてなかった。期待する動作としてはbeginElementを呼んだ時点でアニメーションが始まってほしい。仕様書見たらあった。

属性定義：

begin : begin-value-list
要素がいつ開始される（即ち活動状態になる）べきかを定義する。
属性値はセミコロンで区切られた値のリスト。

"indefinite"
アニメーション開始は "beginElement()" メソッド呼び出しまたは要素へのハイパーリンク呼び出しによって定まる。

http://www.hcn.zaq.ne.jp/___/REC-SVG11-20030114/animate.html

さっきのに

animate.setAttribute('begin', 'indefinite');

を足したら動いた。

前この指定なしで動いてたのはchromeが対応してなかっただけなのかな。