2016-01-23 83 views
6

我有一个svg stroke-linecap属性的问题。我在AngularJS中有一个圆形的进度条,我想设置外部圆圈(蓝色),以便有一个圆形的“结束”。看看这个fiddleSVG stroke-linecap不适用于Firefox中的圈子吗?

<svg ... height="130" width="130"> 
<!-- ngIf: background --> 
<circle ... 
    ng-if="background" 
    fill="#fff" 
    class="ng-scope" 
    stroke-width="13" 
    stroke="#cc3399" 
    r="57.5" 
    cy="65" 
    cx="65" 
    stroke-linecap="round" 
/> 
<!-- end ngIf: background --> 
<circle ... 
    fill="none" 
    stroke-dashoffset="36.12831551628261" 
    stroke-dasharray="361.28315516282623" 
    stroke-width="13" 
    stroke="#432db3" 
    stroke-linecap="round" 
    r="57.5" 
    cy="65" 
    cx="65" 
    transform="rotate(-89.9, 65, 65)" 
/> 
</svg> 

我该怎么做?

+0

它在Chrome上有圆角。 – Harry

+1

但不是在Mozilla中。有趣。 –

+0

是的,我正在开发Firefox的网站,并没有四舍五入的结束:( – user3216673

回答

1

这是从Firefox 45开始的fixed