echarts画饼环状饼图相关参数配置

  今天做页面的时候用到了环状饼图,大家都知道echarts的API文档看起来实在费劲,折腾了半天才画出来我想要的饼图,把我用到的参数配置分享给大家,希望能帮到和我一样的对echarts不是那么熟悉的童鞋。直接上代码:

 1 var option = {
 2     series: [
 3       {
 4         type:'pie',
 5         // 第一个参数是内圆半径,第二个参数是外圆半径,相对饼图的宿主div大小
 6         radius: ['40%', '50%'],
 7         avoidLabelOverlap: false,
 8         // 禁用饼状图悬浮动画效果
 9         animation: false,
      
10 label: { 11 normal: { 12 // 这里的竖线前面的b 和 per是相应参数的别名(我理解为别名),对应下面rich属性里的b和per 13 formatter: '{b|{b}:}{c} ({per|{d}%})', 14 backgroundColor: '#eee', 15 borderColor: '#aaa', 16 borderWidth: 1, 17 padding: 5, 18 borderRadius: 4, 19 rich: { 20 b: { 21 fontSize: 8, 22 lineHeight: 15 23 }, 24 per: { 25 align: 'center' 26 } 27 } 28 } 29 }, 30 data:[ 31 {value:1432, name:'合格'}, 32 {value:500, name:'不合格'} 33 ] 34 } 35 ] 36 }

大体效果是这样的:

  

比较简陋,如有错误,欢迎指正!!

原文地址:https://www.cnblogs.com/Kailey/p/8136999.html