尽管hinting the browser about anti-aliasing in svg有一些标准化的选项，但对于我有圆角矩形的情况，它们似乎都不起作用-因此无法关闭抗锯齿功能。
尽管我的矩形的大小使它们之间没有垂直间隔，但是由于抗锯齿的影响，它们之间会显示一条细线。例如。我的svg在像素80处有一个矩形末端，下一个像素在81处开始，但是它们之间仍然显示出细线。
无法强制最新版本的浏览器避免对直线进行抗锯齿(crispEdges不会对我的圆角矩形强制消除锯齿)。
我读了一些关于通过在y值上加上0.5像素来进行调整的信息，以及关于仅调整偶数或仅奇数y值的信息(我相信这与大多数现代LCD屏幕都包含two hardware vertical pixels per software exposed pixel的事实有关)。我不确定这将如何缓解问题，并且想确切地说明为什么这确实有意义以及什么是最正确/最可靠的调整方法。
最佳答案
two hardware vertical pixels per software exposed pixel
不，那是错的。
当您在SVG中指定像“81”这样的坐标时，该坐标落在像素80和81之间的假想线上。如果您的线的宽度为“1”，则渲染器将尝试通过放置50％的颜色来绘制该坐标在80像素上占50％，在81像素上占50％。这是抗锯齿。如果您不希望这样对一个像素线进行抗锯齿，则将其坐标设为81.5。这样，整条线将落在像素81内。
但是，如果您的线条的宽度为2(或任何其他均匀宽度)，则不应使用81.5，而应保持为81。因为它将在像素80中渲染50％(即1)，在像素81中渲染50％(即1)。没有抗锯齿效果。
这适用于水平线和垂直线。并适用于您使用LCD还是旧的CRT。
这种解释现在有意义吗？
关于svg - 避免在相邻的SVG矩形之间形成线条，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23376308/