2023-09-10

var averagenum = 60;
var pass_rate = 70;
let average = averagenum * pass_rate * 0.01,
  total = 100; // 360*70%=252度数     252/360=0.7

option = {
  series: [
    {
      name: '通过率' + pass_rate + '%',
      type: 'pie',
      radius: ['50%', '54%'],
      //禁止鼠标悬停放大
      hoverAnimation: false,
      startAngle: 215,
      animation: false,
      silent: true,
      //环的位置
      label: {
        show: true,
        position: 'center',
        formatter: (a) => {
          console.log(a);
          return `{p|xxx}\n\n\n{p1|${a.name}}`;
        },
        verticalAlign: 'top',
        rich: {
          p: {
            color: 'blue',
            fontSize: '28px'
          },
          p1: {
            color: '#f00'
          }
        }
      },
      itemStyle: {
        borderRadius: 10
      },
      labelLine: {
        normal: {
          show: true
        }
      },
      data: [
        {
          value: pass_rate, //需要显示的数据
          name: '通过率' + pass_rate + '%',
          itemStyle: {
            normal: {
              color: 'blue'
            }
          }
        },
        {
          value: total - pass_rate,
          //不需要显示的数据，颜色设置成和背景一样
          itemStyle: {
            normal: {
              color: 'transparent'
            }
          }
        }
      ]
    },
    {
      name: '平均值' + average + '%',
      type: 'pie',
      roundCap: true,
      radius: ['50%', '54%'],
      hoverAnimation: false,
      startAngle: 215,
      label: {
        show: false,
        position: 'center'
      },
      labelLine: {
        normal: {
          show: false
        }
      },
      itemStyle: {
        borderRadius: 10
      },
      data: [
        {
          // name:'平均值'+average+'%',
          value: average,
          itemStyle: {
            normal: {
              color: {
                // 完成的圆环的颜色
                colorStops: [
                  {
                    offset: 0,
                    color: '#2449F3' // 0% 处的颜色
                  },
                  {
                    offset: 1,
                    color: '#7493F8' // 100% 处的颜色
                  }
                ]
              }
            }
          }
        },
        {
          value: total - average,
          itemStyle: {
            normal: {
              color: 'transparent'
            }
          }
        }
      ]
    }
  ]
};