所以无论如何，这是一个合法的chrome bug。有一个修复，使svg '更大'，svg文件，内部报告为太小导致这个bug。

经过多次研究，我终于找到了一个可行的解决办法：
导出svg所需维度的两倍（因此我将其命名为filename@2x.svg）
然后在css中添加transform: scale(0.5)
Chrome中的结果与Firefox中的结果相同。

我在使用SVG背景的元素时也遇到过这个错误。解决方法是将不透明度降低0.01，即：

.thing {
    background: url('my-image.svg');
    opacity: 0.99;
}

没有一个变通方法（opacity: 0.99，transform: scale(0.5)，...）对我有效，所以我用这个代替：

PNG@2x（PNG大小的两倍）

这似乎在所有浏览器中都能很好地工作。

问题是随着图形变小，需要处理的像素也变少了。当渲染SVG时，浏览器使用公式来确定像素，但公式导致的数字落在像素之间。
解决方案似乎是在编辑程序中设置SVG所需的大小，然后确保所有像素都与网格对齐。这仍然允许SVG放大，但也允许它以较小的大小呈现。
这是一个很好的解决方案，它可以让你在一个更小的尺寸下绘制出更好的效果。