svg中相同描边宽度的圆圈，不同宽度原因
在一个svg文档中，绘制了两个同心圆圈，尽管都设置了相同的描边宽度（10），但第二个圆圈却显得更宽。这是为什么呢？
答案在于svg的描边和填充规则。
在svg中，描边（stroke）围绕填充（fill）绘制，采用居中对齐的方式。这意味着描边的一部分将覆盖填充区域，而另一部分将位于填充区域之外。
默认情况下，svg采用“填充后描边”的规则。这意味着，在渲染圆圈时，首先填充内部区域（白色），然后才绘制描边（灰色和黑色）。
由于第二个圆圈具有破折号线样式（stroke-dasharray="50% 50%"），因此填充会在黑色描边的间隙中显示为白色。这使得黑色描边的视觉效果更宽，尽管实际描边宽度与灰色描边相同。
若要解决此问题，可以使用“描边后填充”规则。通过设置 fill-rule 属性为 evenodd，可以将描边放置在填充区域的上面。
修改后的代码如下：
