饼图echarts rgba(0,0,0,0)配置项内容和展示

饼图

       let colors = ['#35d964', '#d9bc39', '#da5660'],
     color;
 let data = 1; //数值大小
 let max = 3; //满刻度大小
 let title = {
     text: data,
     subtext: 'PUE',
     x: 'center',
     y: 'center',
     textStyle: {
         color: '#fff',
         fontSize: 30
     },
     subtextStyle: {
         color: '#fff',
         fontSize: 12
     }
 };

 if (data < 1.5) {
     color = colors[0];
 } else if (data > 1.5 && data < 2.5) {
     color = colors[1];
 } else if (data > 2.5 || data == 2.5) {
     color = colors[2];
 }
 option = {
     backgroundColor: '#000f1e',
     title: title,
     series: [{
             type: "pie",
             center: ["50%", "50%"],
             radius: ["85%", "85%"],
             hoverAnimation: false,

             data: [{
                     name: "",
                     value: data * 0.8,
                     itemStyle: {
                         borderColor: color,
                         borderRadius: 10,
                         borderWidth: 5,
                         color: color,
                     },
                     labelLine: {
                         show: false,
                         lineStyle: {
                             color: 'rgba(0,0,0,0)',
                             width: 2
                         }
                     }

                 },
                 { //画中间的图标
                     name: "",
                     value: 0,
                     label: {
                         position: 'inside',
                         backgroundColor: color,
                         borderRadius: 10,
                         borderWidth: 5,
                         borderColor: 'rgba(0,0,0,0.9)',
                         padding: 10,
                     },

                 },
                 {
                     name: "",
                     value: data * 0.2,
                     itemStyle: {
                         borderColor: color,
                         borderWidth: 5,
                         color: color,
                     },
                     labelLine: {
                         show: false,
                         lineStyle: {
                             color: 'rgba(0,0,0,0)',
                             width: 2
                         }
                     }

                 },
                 { //画剩余的刻度圆环
                     name: "",
                     value: max - data,
                     label: {
                         show: false
                     },
                     itemStyle: {
                         borderType: 'dashed',
                         borderRadius: 10,
                         borderColor: '#919192',
                         borderWidth: 5,
                         color: 'rgba(0,0,0,0)',
                     },
                     labelLine: {
                         show: true,
                         lineStyle: {
                             color: 'rgba(0,0,0,0)',
                             width: 2
                         }
                     },

                 }
             ]
         },


     ]
 };