饼图进度条显示echarts 50%配置项内容和展示

分辨率不一样，显示出来会有部分偏移

        //显示数据
    data = 300;
    //总数据
    max = 600;
    //分割线宽度
    width = data === 0 ? 0 : 4;
    //指定数值在圆弧中所占角度
    scaleAn = 270/max;
    //圆弧起始位置的角度
    startAngle = 225-data*scaleAn;
    if(max-data == max/100*25){
      startAngle = 225-max*scaleAn;
    }
    //分割比例
    scaleSp = 80/max;
    //分割线的分割数值
    splitNum = data*scaleSp

    option = {
      title:{
        text:'测试',
        x:'center',
        top:'15%'
      },
      backgroundColor: '#fff',
      tooltip: {
        trigger: "item"
      },
      series: [{
        name: "",
        type: "gauge",
        radius: "58%",
        center: ['50%', '50%'],
        startAngle: startAngle,
        endAngle: 225,
        splitNumber: splitNum,
        hoverAnimation: false,
        axisTick: {
          show: false
        },
        splitLine: {
          length: 11,
          lineStyle: {
            width: width,
            color: "#00a2ff"
          }
        },
        axisLabel: {
          show: false
        },
        pointer: {
          show: false
        },
        axisLine: {
          lineStyle: {
            opacity: 0
          }
        },
        detail: {
          show: false
        },
        data: [{
          value: 0,
          name: ""
        }]
      },
        {
          name: "",
          type: "pie",
          radius: ["45%", "50%"],
          center: ['50%', '50%'],
          silent: true,
          clockwise: true,
          startAngle: 225,
          z: 0,
          zlevel: 0,
          label: {
            normal: {
              position: "center",

            }
          },
          data: [{
            value: data,
            name: "",
            label: {
              normal: {
                formatter: function(param) {
                  return param.data.value
                },
                fontSize: 24,
                color: '#333',
                fontFamily: 'Microsoft YaHei'
              }
            },
            itemStyle: {
              normal: {
                color: "#63EBFF"
              }
            }
          },
            {
              value: max-data-max/100*25,
              name: "",
              label: {
                normal: {
                  show: false
                }
              },
              itemStyle: {
                normal: {
                  color: "#63EBFF"
                }
              }
            },

            {
              name: '剩余',
              value: max/100*25,
              label: {
                show:false
              },
              itemStyle: {
                normal: {
                  color: 'transparent'
                }
              }
            }
          ]
        },

      ]
    }
    myChart.setOption(option)