为什么 Firefox 不会测量这个 SVG 路径的长度答案

【问题标题】：Why will Firefox not measure the length of this SVG path为什么 Firefox 不会测量这个 SVG 路径的长度
【发布时间】：2015-06-29 08:37:15
【问题描述】：

SVG：

<g fill="none" stroke-width="0.6">
    <path id="trouble" stroke-miterlimit="10" stroke="#ff5500" d="M1051.19,607.23c3.8-1.9,4.1,4.9,3.5,7c-0.7,2.3-2.6,4.6-5.3,3.8c-3.9-1.1-4.4-6.9-4-10.1c0.8-7.2,7.2-10.7,12.2-4.4c4.1,5.2,5.4,15.4,4.7,21.8c-0.5,4.4-3.3,10.4-8.8,8.1c-4.6-1.9-4.4-9.8-0.1-11.9c7.9-3.8,4.5,12.1-0.3,6.8"/>
</g>

Chrome 和 Firefox 都正确地绘制了红色的小波浪线。 Chrome 使用 path.getTotalLength() 正确测量路径长度。 Firefox 返回 NaN 作为路径长度。为什么？

（我有几十个其他路径，Firefox 可以正确测量其长度。特别是关于这条路径的一些东西，是使用 Illustrator 生成的。语法对我来说是正确的 AFAIK。）

见：

http://codepen.io/anon/pen/oXpqqg

【问题讨论】：

可能bugzilla.mozilla.org/show_bug.cgi?id=1134549 那里有一个应该很快就会发布的补丁。
谢谢罗伯特。问题是，我的坐标远没有 Klaus 在那个 bug 中的测试用例那么大。嗯。
下载源代码，应用补丁，看看是否能解决您的问题。如果有，那就太好了，如果没有在 bugzilla 中引发错误。
我请上述补丁的作者测试它是否修复了这个错误。他证实确实如此。希望修复程序能很快进入 FF。

标签： javascript firefox svg

【解决方案1】：

如果您稍微调整路径以绕过the FF bug，您就可以让它工作。

似乎有一条曲线触发了这个错误：

c0.8-7.2,7.2-10.7,12.2-4.4

如果你稍微改变一下，这个错误就可以避免：

c0.9-7.2,7.2-10.7,12.2-4.4

Demo

【讨论】：

谢谢你，保罗——我真的很感谢你对这一点的及时关注。不幸的是，我的应用程序涉及大量任意路径，因此手动调整有问题的元素是不切实际的。希望尽快在 Nightly 中看到这片土地。