2016-11-08 13 views
0

楕円形の要素を含む単純なSVGを作成しようとしていますが、サファリ(そしてSafariのみ)ではの非円形の楕円の幅が2倍になります。楕円が完全に円形(rx == ry)の場合、楕円は通常通り描画されます。ダブル幅の楕円形のサファリsvg

誰もこの動作を以前に見たことがありますか、それを回避する方法がありますか? MacOS 10.12.1、Safari 10.0.1(12602.2.14.0.7)で動作が確認されています。それはまた、私の網膜ディスプレイ(2014MBP)にのみ現れ、網膜以外の外部ディスプレイには現れません。

はここで私が使用しているhtmlファイルです:

<!DOCTYPE html> 

<body> 

<style> 
    circle { 
    stroke: blue; 
    stroke-width: 3; 
    fill: none; 
    } 
    ellipse { 
    stroke: green; 
    stroke-width: 3; 
    fill: none; 
    } 
</style> 

<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
    <circle cx="50" cy="50" r="40"/> <!--Draws with normal stroke--> 
    <circle cx="60" cy="60" r="40"/> <!--Draws with normal stroke--> 
    <ellipse cx="70" cy="70" rx="40" ry="20"/> <!--Draws with doubled stroke--> 
    <ellipse cx="80" cy="80" rx="20" ry="20"/> <!--Draws with normal stroke--> 
</svg> 

</body> 

そして、ここでは結果のスクリーンショットです:

svg with doubled ellipse stroke

+0

あなたはWebKitのバグを見つけた場合は、[レポートこれ](https://webkit.org/reporting-bugs/) –

+0

それはhttps://jsfiddle.net/x2m2zyzvサファリV10に私に正しく表示されます/ – Duopixel

答えて