Animation SVG圆形渐变进度在每条路径之间有一个小的白色边框

我有这个密码笔：

第一项有我找到的代码帮助，可以消除路径之间的白色小边框，但抗别名代码在路径上不起作用：

应用svg标记I:shape rendering=“crispEdge”

---

我应用的路径标记：shape rendering=“optimizeQuality”是否确实需要六个渐变？在我看来，一个就足够了。然后你的裂缝问题就消失了

svg{
宽度：400px；
}

---

您确定需要六个渐变吗？在我看来，一个就足够了。然后你的裂缝问题就消失了

svg{
宽度：400px；
}

路径稍微重叠。路径稍微重叠。非常感谢！！！我在这方面很困难，我是SVG和动画的新手，有这么多的参数，这完全帮助解决了这个问题，另一个简单的问题是，你知道我的代码在哪里控制动画填充的速度，我真的无法确定它的

10s

（10秒）在

动画中：加载10s

非常感谢！！！我在这方面遇到了困难，我是SVG和动画的新手，有这么多的参数，这完全帮助解决了这个问题，另一个简单的问题是，你知道我的代码在哪里控制动画填充的速度吗，我真的无法确定这是

动画中的
10s
（10秒）
动画：加载10s
<li data-name="" data-percent="">
        <svg viewBox="-10 -10 229 229" shape-rendering="crispEdges">
        <g fill="none" stroke-width="10" transform="translate(100,100)">
        <path d="M 0,-100 A 100,100 0 0,1 86.6,-50" stroke="url(#cl1)"  shape-rendering="optimizeQuality" />
        <path d="M 86.6,-50 A 100,100 0 0,1 86.6,50" stroke="url(#cl2)"/>
        <path d="M 86.6,50 A 100,100 0 0,1 0,100" stroke="url(#cl3)"/>
        <path d="M 0,100 A 100,100 0 0,1 -86.6,50" stroke="url(#cl4)"/>
        <path d="M -86.6,50 A 100,100 0 0,1 -86.6,-50" stroke="url(#cl5)"/>
        <path d="M -86.6,-50 A 100,100 0 0,1 0,-100" stroke="url(#cl6)"/>
        </g>
        </svg>
        <svg viewBox="-10 -10 229 229">
        <path d="M200,100 C200,44.771525 155.228475,0 100,0 C44.771525,0 0,44.771525 0,100 C0,155.228475 44.771525,200 100,200 C155.228475,200 200,155.228475 200,100 Z" stroke-dashoffset="629"></path>
        </svg>
    </li>