油表图-数值随着指针位置变动echarts 0%配置项内容和展示

我太难了 用detail偏移试了好久，定位还是不准确，换个方法终于搞出来了

            let fontSize = 20; //字体大小
      let textColor = "#000";
      let nameTextColor = "#000";
      let axisLineColor = "#000";
      let nameColor = "rgba(97, 104, 112,1)";
      let datas={
        dataArr: [
          {
            // value: nowData||26589,
            value: 39376,
            name: "",
          },
        ],
        min:23376,
        max:43161,
        unit: "MW",
      };
      var dataArr = datas.dataArr;
      let nowData=dataArr[0].value;
      let min = datas.min;
      let max = datas.max;
       let splitNumber=max-min;
      let per = (dataArr[0].value - min) / (max - min);
      let unit = datas.unit;
      // let offsetX=(dataArr[0].value/max)*100;
    //   let angle =  180 *(dataArr[0].value-min)/(max-min);
      // angle=30;
    //   let offsetY = 0;
    //   let offsetX = 0;
    //   let radius=120;
    //   if (angle <= 90) {
    //     offsetX = -(radius * (Math.abs(Math.cos(angle))));
    //     offsetY = -radius * (Math.abs(Math.sin(angle)));
    //   }else{
    //     // offsetX = radius * (Math.abs(Math.sin(180-angle)));
    //     // offsetY = -radius *  (Math.abs(Math.cos(180-angle)));
    //     offsetX = radius * (Math.sin(180-angle));
    //     offsetY = radius *  (Math.cos(180-angle));
    //   }
      // let offsetY=120*(Math.sin(angle));
      // let offsetX=120*(Math.cos(angle));
// alert(angle)
    //   console.log(angle,"offsetX=",  offsetX,"offsetY=",  offsetY);
      var color = new echarts.graphic.LinearGradient(
        0,
        0,
        1,
        0,
        [
          {
            offset: 0,
            color: "#5c53d1", // 0% 处的颜色
          },
          {
            offset: 1,
            color: "#18c8ff", // 100% 处的颜色
          },
        ],
        false
      );
      var colorSet = [
        [per, color],
        [1, "#413e54"],
      ];
      let startAngle = 180;
      let endAngle = 0;
      let center = ["50%", "63%"];
      option = {
        tooltip: {
          show: false,
        },
        series: [
          {
            type: "gauge",
            radius: "90%",
            startAngle,
            endAngle,
            center,
            pointer: {
              show: false,
            },
            // data: dataArr,
            title: {
              show: false,
            },
            axisLine: {
              show: false,
              lineStyle: {
                color: colorSet,
                width: 35,
                shadowOffsetX: 0,
                shadowOffsetY: 0,
                opacity: 1,
              },
            },
            axisTick: {
              show: true,
              splitNumber: 5,
              length: 8,
            },
            splitLine: {
              length: -8, //刻度节点线长度
              lineStyle: {
                width: 2,
                color: "rgba(255,255,255,.8)",
              }, //刻度节点线
            },
            axisLabel: {
              show: false,
            },
            detail: {
              show: 0,
            },
            animationDuration: 4000,
          },
          {
            name: "白色圈刻度",
            type: "gauge",
            radius: "80%",
            startAngle, //刻度起始
            endAngle, //刻度结束
            center,
            min,
            max,
            splitNumber: 1,
            z: 4,
            axisTick: {
              show: false,
            },
            splitLine: {
              length: 16, //刻度节点线长度
              lineStyle: {
                width: 2,
                color: "#018DFF",
              }, //刻度节点线
            },
            axisLabel: {
              formatter: function (v) {
                if (v == min) {
                  return `{min|${min}${unit}\n最小}`;
                } else {
                  return `{max|${max}${unit}\n最大}`;
                }
              },
              rich: {
                min: {
                  // 下右上左
                  padding: [0, 0, 80, -120],
                  color: "#000",
                  fontSize: fontSize,
                  lineHeight: 30,
                },
                max: {
                  // 下右上左
                  padding: [0, -120, 80, 0],
                  color: "#000",
                  fontSize: fontSize,
                  lineHeight: 30,
                },
              },
            }, //刻度节点文字颜色
            pointer: {
              show: false,
            //   width: 8,
            //   length: "90%",
            },
            detail: {
              show: false,
            //   offsetCenter: [offsetX + "%",  offsetY + "%"],
            // //   offsetCenter: ["-15%",  "-110%"],
            //   formatter: function (value) {
            //     return `{a|当前\n${dataArr[0].value}${unit}}`;
            //   },
            //   rich: {
            //     a: {
            //       color: "red",
            //       fontSize,
            //     },
            //   },
              // 中间字体偏移量
              // offsetCenter: ['0%', '0%'],
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: colorSet,
                width: 10,
                shadowOffsetX: 0,
                shadowOffsetY: 0,
                opacity: 1,
              },
            },
            data: dataArr,
          },
         {
            name: '内部圈',
            type: 'gauge',
            z: 10,
              center,
            min,
            max,
            splitNumber: splitNumber,
            radius: '120%',
             startAngle, //刻度起始
            endAngle, //刻度结束
            axisLine: {
                show: false,
              lineStyle: {
                color: colorSet,
                // width: 10,
                // shadowOffsetX: 0,
                // shadowOffsetY: 0,
                // opacity: 0,
              },
            },
            
            tooltip: {
                show: false
            },
            axisLabel: {
                show: true,
                // padding:[-70,-90,0,0],
                color:"red",
                formatter:function(v){
                    // console.log("vv",v,"当前数值"+nowData)
                    if(v==nowData){
                        // alert(v)
                        return "当前数值\n"+nowData;
                    }
                }
            },
            axisTick: {
                show: false,

            },
            splitLine: {
                show: false,
            },
            itemStyle: {
                show: false,
            },
            detail: {
                show: false
            },
            title: { //标题
                show: false,
            },
            data: [{
                name: "title",
                value: nowData,
            }],
            itemStyle: {
                normal: {
                    color: 'rgba(145,207,255,1)'
                }
            },
            pointer: {
            show: true,
              width: 8,
              length: "60%",
            },
            animationDuration: 4000,
        },
        ],
      };