当笔画宽度改变时,为什么这个svg会在Chrome中变得如此之大?

时间:2018-05-25 21:10:43

标签: html svg

这里我有一个SVG路径,从一个以纬度为单位的多边形创建,渲染两次,一次绘制宽度为6e-5,一次绘制宽度为7e-5。



<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="50px" height="50px" viewBox="-93.146752514 -41.665871084 0.006181792 0.006973032">
    <path d="M -93.144986629000002 -41.665658802999999 L -93.145040273999996 -41.662124163000001 -93.146692513999994 -41.659406928000003 -93.146606684000005 -41.659006146000003 -93.140652180000004 -41.658958052000003 -93.140630721999997 -41.664897388999997 -93.141059874999996 -41.665225999999997 -93.141070604000006 -41.66577101 -93.144932984999997 -41.665811083999998 Z" stroke="black" stroke-width="6e-05" fill="none" />
</svg>

<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"
    width="50px" height="50px" viewBox="-93.146752514 -41.665871084 0.006181792 0.006973032">
    <path d="M -93.144986629000002 -41.665658802999999 L -93.145040273999996 -41.662124163000001 -93.146692513999994 -41.659406928000003 -93.146606684000005 -41.659006146000003 -93.140652180000004 -41.658958052000003 -93.140630721999997 -41.664897388999997 -93.141059874999996 -41.665225999999997 -93.141070604000006 -41.66577101 -93.144932984999997 -41.665811083999998 Z" stroke="black" stroke-width="7e-05" fill="none" />
</svg>
&#13;
&#13;
&#13;

在Firefox中,我看到同一图像的两个副本。在Safari中,我只看到7e-5多边形。在Chrome中,我看到了6e-5多边形,而7e-5多边形变成了一个巨大的黑色质量。

Chrome问题是最麻烦的,因为它意味着将svg插入任何地方溢出并覆盖其周围的元素。关于可能导致不同渲染的原因的任何想法,以及我如何能够使其不断发生?

0 个答案:

没有答案