Javascript を介して SVG アニメーション要素をグループに追加しようとしています。「animateTransform」は、数値を使用する場合にのみ機能するようです。getBBox で定義された変数を使用すると再生されません (アスタリスク内の行を参照)。ただし、境界ボックスのスクリプトはこれらの値を使用して機能します。
結果は Chrome と Firefox で同じなので、何か間違っていると思います。誰かが私を助けてくれたらありがたいです...
var svgNamespaceURI = "http://www.w3.org/2000/svg"
var rectgroup;
function startup(evt)
{
rectgroup = document.getElementById('rectg');
test(rectgroup);
}
function test(target)
{
var bounds = target.getBBox();
var cx = bounds.x+(bounds.width/2);
var cy = bounds.y+(bounds.height/2);
var animation = document.createElementNS(svgNamespaceURI, 'animateTransform');
animation.setAttributeNS(null, 'attributeName', 'transform');
animation.setAttributeNS(null, 'type', 'rotate');
**animation.setAttributeNS(null, 'values', '0,cx,cy; 360,cx,cy');>**
animation.setAttributeNS(null, 'begin', '0s');
animation.setAttributeNS(null, 'dur', '5s');
target.appendChild(animation);
}
編集: 境界ボックスのコードを削除して、少しわかりやすくしました。