1

http://jsfiddle.net/EyrRD/をご覧ください。D3.jsライブラリを使用して、幅を変更することでSVG長方形をアニメーション化します。

rect.transition().duration(2000).delay(500).ease("cubic-out").attr("width", 500);​

他のブラウザではすべて正常に動作しますが、Firefoxでは長方形の幅が300pxに達するとアニメーションが突然停止します。実際には、宛先の幅(> = 300)は関係ありませんが、常に300pxで停止します。それは本当にバグですか?もしそうなら、これを克服する方法は?ちなみに、D3.jsはこの種のSVGアニメーションに最適なツールですか?

4

1 に答える 1

1

widthSVGのを設定する必要があります。

var svg = d3.select("body").append("svg").attr("width", 1000);

Firefoxやその他のブラウザでは、svg:svg要素の幅と高さを設定する必要があります。これはFirefoxのバグです。これが私の関連するSOの答えです。

于 2012-12-11T14:55:58.590 に答える