带你快速实现扇形图？

首先我们需要了解一个新的概念：conic-gradient     圆锥形渐变

1. 特性：圆锥渐变的起始点是图形中心，渐变方向以顺时针方向绕中心旋转实现渐变效果
2. 兼容性：

根据 can i use，目前只在chrome 69及以上支持。

　　可以使用polyfill垫片库，解决兼容性问题。垫片库会根据css语法，生成对应的圆锥渐变图案，并且转化为 base64 代码。

// 需加入的js库
<script src="//cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<script src="//leaverou.github.io/conic-gradient/conic-gradient.js"></script>

实例：

<div id="fan"></div>

#fan{
    width:200px;
    height:200px;
    border-radius:50%;
    /* 百分比 写法一 */
    background: conic-gradient(skyblue 0, skyblue 15%, lime 30%, lime 100%); 
}

这是我想到的最简单的实现扇形图的方式了，如果小伙伴们有更好的方法，欢迎交流！