Firefox 中的 D3.js 转换错误？答案

【问题标题】：D3.js transition bug in Firefox?Firefox 中的 D3.js 转换错误？
【发布时间】：2012-12-11 23:03:54
【问题描述】：

看看http://jsfiddle.net/EyrRD/。我使用 D3.js 库通过更改宽度来为 SVG 矩形设置动画：

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

在其他浏览器中一切正常，但在 Firefox 中，当矩形宽度达到 300 像素时动画突然停止。实际上，目标宽度是多少（> = 300）并不重要，它总是停在 300 像素处。这真的是一个错误吗？如果是这样，如何克服这一点？顺便问一下，D3.js 是这种 SVG 动画的最佳工具吗？

【问题讨论】：

【解决方案1】：

你需要设置SVG的width：

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

在 Firefox 和其他浏览器中，您需要为 svg:svg 元素设置宽度和高度。这是一个 Firefox 错误，这里是我的相关@987654321@。

【讨论】：

谢谢。我实际上尝试“手动”设置 SVG 宽度（通过将样式参数添加到 svg elem）并且它没有改变任何东西，所以我认为问题出在其他地方。你认为 D3.js 是处理 SVG 的最佳工具吗？
是的，就易用性和性能而言，我认为 d3 是最好的。
这不是错误。预计其他浏览器将来会要求这样做。
好的，这是一项功能 ;) - 感谢您指出 that。