echart - 饼图显示数据值

opt.series = [{
      name: '',
      type: 'pie',
      radius: ['45%', '70%'], // 外圈
      avoidLabelOverlap: true,
      padAngle: 8, // 
      itemStyle: {
        borderWidth: 8,
        borderRadius: 8,
        color: COLORS.lightYellow
      },
      label: {
        show: true,
        position: "inner",
        formatter: (params) => `${params.percent}%`, // 显示数据值在饼图上
      },
      emphasis: {
        label: { show: true, fontSize: 16, fontWeight: "bold" },
        itemStyle: { shadowOffsetX: 0, shadowColor: "rgba(0, 0, 0, 0.5)" },
        scale: true,
        scaleSize: 6,
      },
      animationEasing: "cubicOut",
     
      data: [{
          value: 23,
          name: '今日收入',
          itemStyle: {
            color: COLORS.green,
          },
          
        },
        {
          value: 55,
          name: '总收入',
          itemStyle: {
            color: COLORS.blue
          },
        }
      ]
    }];

 

新的完整options.

{
    "tooltip": {
        "trigger": "axis",
        "borderColor": "#fff",
        "shadowOffsetX": 0,
        "shadowOffsetY": 0,
        "textStyle": {
            "fontSize": 11,
            "textShadowColor": "transparent",
            "textShadowBlur": 10
        },
        "axisPointer": {
            "type": "line"
        },
        "confine": true
    },
    "legend": {
        "y": "top",
        "padding": [5, 32, 15, 5],
        "orient": "horizontal",
        "icon": "circle",
        "data": ["慢充", "快充", "超充"],
        "itemWidth": 16,
        "itemHeight": 15,
        "itemGap": 10,
        "textStyle": {
            "fontSize": 12
        },
        "type": "plain"
    },
    "grid": {
        "left": "15%",
        "right": "10%",
        "bottom": 20,
        "top": 80,
        "containLabel": false
    },
    "yAxis": [{
        "type": "value",
        "name": "",
        "scale": true,
        "nameLocation": "end",
        "nameGap": 10,
        "splitNumber": 4,
        "axisLine": {
            "lineStyle": {
                "color": "#515051"
            }
        },
        "nameTextStyle": {
            "align": "right",
            "padding": [0, 10, 0, 0]
        },
        "splitLine": {
            "show": true,
            "lineStyle": {
                "color": "#eee",
                "type": "dashed"
            }
        },
        "axisLabel": {
            "color": "#515051"
        }
    }, {
        "type": "value",
        "scale": true,
        "splitNumber": 4,
        "axisLine": {
            "lineStyle": {
                "color": "#515051"
            }
        },
        "splitLine": {
            "show": true,
            "lineStyle": {
                "color": "#eee",
                "type": "dashed"
            }
        },
        "axisLabel": {
            "color": "#515051"
        }
    }],
    "xAxis": [{
        "type": "time",
        "axisTick": {
            "show": false
        },
        "data": [],
        "splitNumber": 3,
        "axisLine": {
            "lineStyle": {
                "color": "#999"
            }
        },
        "axisLabel": {
            "color": "#666"
        },
        "show": false
    }],
    "series": [{
        "name": "",
        "type": "pie",
        "radius": ["38%", "70%"], // 外圈
        "avoidLabelOverlap": true,
        "center": ["50%", "55%"], // 往下移动

"padAngle": 8,
        "itemStyle": {
            "borderWidth": 3,
            "borderRadius": 2,
            "color": "#FFBA29"
        },
        "label": {
            "color": "#fff",
            "show": true,
            "position": "inner"
        },
        "emphasis": {
            "label": {
                "show": true,
                "fontSize": 16,
                "fontWeight": "bold"
            },
            "itemStyle": {
                "shadowOffsetX": 0,
                "shadowColor": "rgba(0, 0, 0, 0.5)"
            },
            "scale": true,
            "scaleSize": 6
        },
        "animationEasing": "cubicOut",
        "data": [{
            "value": 23,
            "name": "慢充",
            "itemStyle": {
                "color": "#63D471"
            }
        }, {
            "value": 55,
            "name": "快充",
            "itemStyle": {
                "color": "#FE7D00"
            }
        }, {
            "value": 12,
            "name": "超充",
            "itemStyle": {
                "color": "#4D69D9"
            }
        }]
    }]
}