IE10 SVG实现拒绝antialias <rect>元素?</rect>

时间:2013-09-16 16:40:06

标签: svg internet-explorer-10 antialiasing

我一直在使用d3和SVG来制作图表库,以显示一系列矩形。数据集控制要在给定区域中显示的矩形的数量,并且在大多数情况下,数学不能干净地运行,这意味着矩形不会以整数开始和结束。 Firefox,Chrome和Safari都通过对矩形进行抗锯齿处理这种偶然性。 IE似乎只是舍入到最近的像素值,并拒绝对任何矩形元素进行抗锯齿。我试过改变形状渲染之类的东西,但没有用。

以下是IE10中相同数据与最新Chrome版本的并排比较:

IE10:

enter image description here

铬:

enter image description here

是否有人知道修复此问题并不涉及更改SVG标记的结构?设置CSS属性或标记属性比更改元素本身更可取。除此之外,有没有人看过任何微软文档解释这个决定的理由?到目前为止,我还没有找到任何一个。

1 个答案:

答案 0 :(得分:0)

IE似乎并不关心形状渲染属性,但我发现你可以通过指定一个微小的旋转变换来强制它来消除别名形状:

svg {
    transform: rotate(.00001deg); /* hack to force anti-aliasing in IE */
}

在IE11上测试。