相关疑难解决方法(0)

以下SVG路径可以绘制一个圆的99.99%:(在http://jsfiddle.net/DFhUF/46/上尝试它,看看你是否看到4个弧或只有2个,但请注意,如果它是IE,它会被渲染在VML中,而不是SVG,但有类似的问题)

M 100 100 a 50 50 0 1 0 0.00001 0

但是当它是一个圆圈的99.99999999%时,什么都没有显示出来？

M 100 100 a 50 50 0 1 0 0.00000001 0    

这与100%的圆圈相同(它仍然是弧形,不是它,只是一个非常完整的圆弧)

M 100 100 a 50 50 0 1 0 0 0 

怎么能修好？原因是我使用一个函数绘制一个弧的百分比,如果我需要"特殊情况"一个99.9999%或100%的弧来使用圆函数,那就太傻了.

同样,使用RaphaelJS的jsfiddle上的测试用例位于http://jsfiddle.net/DFhUF/46/
(如果它是IE 8上的VML,即使第二个圆圈也不会显示......你必须将它改为0.01)

更新:

这是因为我在我们的系统中为得分渲染弧,所以3.3点得到1/3的圆.0.5得到半圈,9.9得到99%的圈.但是如果我们的系统中得分为9.99呢？我是否必须检查它是否接近圆的99.999%,并相应地使用arc函数或circle函数？那么得分9.9987怎么样？哪一个使用？要知道什么样的分数将映射到"太完整的圆圈"并切换到圆形函数是荒谬的,当它是圆圈的"某个99.9%"或9.9987分数时,则使用弧函数.

我想创建一个彩虹圈

如下图:

但是我如何绘制弯曲和多色停止渐变？

这是我目前的代码:

<svg width="500" height="500" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="test">
<stop offset="0%" stop-color="#f00"/>
<stop offset="100%" stop-color="#0ff"/>
</linearGradient>

</defs>

<circle cx="50" cy="50" r="40" fill="none" stroke="url(#test)" stroke-width="6"/>

</svg>

我想知道是否有可能用css渐变做这样的事情:

我搜索了很多,所有的渐变都是"线性"或"径向".我想要的渐变是圆形的线性!

我怎样才能在 CSS 中实现这样的事情？

我已经尝试了很多方法，但深色背景仍然挡住了并且无法剪裁，因此它下面的背景图像不可见......

.item {
  position: relative;
}
    
.item:before {
  content: '';
  size(100%);
  top: 0;
  left: 0;
  z-index: 1;
  background: rgba(0, 0, 0,0 0.1);
}

<div class="item">
   <img>
   <span class="rate">
     <span class="amount">10</span> ??????
   </span>
</div>  

我正在寻找一种能够使部分深色背景透明的方法，以便可以看到图像。