svg动画中的污迹

Question

我正在为SVG设置动画效果，并且注意到浏览器加载完成时不应该出现的污迹或部分SVG。如果您检查此代码笔 - http://codepen.io/claire2013/pen/ouIeg，您会发现眼镜鼻部附近左侧有一点黑色污迹/图样。任何人有一个想法，为什么发生这种情况？

Answer 1

快速和简单的答案
它看起来像你有一个额外的段在你的路径。搜索下列字符串，并将其删除：

M207.795,61.239l0.097,0.008L207.795,61.239z 

（此外，还有在文档的最开头的额外<。）

见固定代码在这里：http://codepen.io/guttentag/pen/JnFzx

新解
在SVG路径中，M命令指示您希望浏览器将笔移动到它后面的坐标以启动路径。 Other commands，直到用Z命令关闭路径。

由于“污迹”在一张纸上看起来像是一个错误的笔划，所以我试图寻找M字符的路径。当我发现一个不久后跟着一个Z时，我知道那是不属于这条路的一部分。我删除了它，污迹消失了。如果我删除了错误的细分，我只是想撤消并尝试下一个可能的嫌疑犯。使用该技术可能会帮助您在将来解决类似的SVG路径问题。