Question

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

Answer 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

为什么Firefox不会测量此SVG路径的长度

1 个答案: