我的情况很简单。如果你绘制一个小椭圆,笔画宽度非常大,那么浏览器会以一种奇怪的“猫眼”效果渲染椭圆。
我在这里有一个 jsfiddle:http: //jsfiddle.net/MyBsC/4/
<svg width="300" height="300" xmlns="http://www.w3.org/2000/svg" version="1.1">
<ellipse cx="80" cy="80" rx="8" ry="10" style="fill:yellow;stroke:purple;stroke-width:50"/>
</svg>
如果你玩弄小提琴并使椭圆变大,效果就会消失。SVG 椭圆和画布内绘制的椭圆都会发生这种情况。
我在 Mac OSX Lion 上的 Firefox 21.0、Chrome 26 和 Safari 5.1.7 上观察到了这种行为
有谁知道为什么会这样?这是浏览器的错误吗?还是我缺少一个 CSS 属性?