雷达图使用示例(仅供参考) ​

// 接口数据
const result = {
    jsonData: [[58, 31, 76, 50],[94, 79, 36, 91]],
    indicatorData: [
        {"max":100,"text":"当班次处理总量"},
        {"max":100,"text":"操作规范情况"},
        {"max":100,"text":"时限达标率"},
        {"max":100,"text":"单人处理量"}
    ]
}
// 图表配置
option = {
    color: ['#17f2c3', '#fff092'],
    legend: {
        orient: 'horizontal',
        icon: 'rect', //图例形状
        data: ['第一班次', '第二班次'],
        bottom: '12px',
        itemWidth: 28, // 图例标记的图形宽度。[ default: 25 ]
        itemHeight: 14, // 图例标记的图形高度。[ default: 14 ]
        itemGap: 40, // 图例每项之间的间隔。[ default: 10 ]横向布局时为水平间隔，纵向布局时为纵向间隔。
        textStyle: {
        fontSize: 14,
        color: '#00E4FF',
        padding: [0, 5],
        },
    },
    radar: {
        center: ['50%', '45%'],
        radius: 80,
        shape: 'circle', // 设置外环为圆，不设置为多边形
        indicator: result.indicatorData,
        splitArea: {
        // 坐标轴在 grid 区域中的分隔区域，默认不显示。
            show: true,
            areaStyle: {
            // 分隔区域的样式设置。
              color: ['rgba(255,255,255,0)', 'rgba(255,255,255,0)'], // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。
            },
        },
        axisLine: {
        //指向外圈文本的分隔线样式
            lineStyle: {
                color: '#153269',
            },
        },
        triggerEvent: true,
        splitLine: {
            lineStyle: {
                color: '#113865', // 分隔线颜色
                width: 1, // 分隔线线宽
            },
        },
        axisName: {
            rich: {
                name: {
                    fontSize: 16,
                    color: '#bbbbbb',
                    align: 'center',
                },
                a: {
                    fontSize: 20,
                    color: '#17f2c3',
                    lineHeight: 24,
                    align: 'left',
                    padding: [0, 10, 0, 0],
                },
                b: {
                    fontSize: 20,
                    color: '#fff092',
                    lineHeight: 24,
                    align: 'left',
                },
            },
            formatter: function (name) {
                let one = 0;
                let two = 0;
                for (let i = 0; i < result.indicatorData.length; i++) {
                    if (result.indicatorData[i].text === name) {
                        one = jsonData[0][i];
                        two = jsonData[1][i];
                    }
                }
                return '{name|' + name + '}\n' + '{a|' + one + '}' + '{b|' + two + '}';
            },
        },
    },
    series: [
        {
            type: 'radar',
            symbol: 'none',
            data: [
                {
                    value: res.jsonData[0],
                    name: '第一班次',
                    axisName: {
                        lineStyle: {
                            color: '#4A99FF',
                            shadowColor: '#4A99FF',
                            shadowBlur: 10,
                        },
                    },
                    areaStyle: {
                        color: 'rgba(35,213,255,0.3)',
                    },
                    itemStyle: {
                        color: '#17f2c3',
                    },
                },
                {
                    value: res.jsonData[1],
                    name: '第二班次',
                    axisName: {
                        lineStyle: {
                            color: '#4BFFFC',
                            shadowColor: '#4BFFFC',
                            shadowBlur: 10,
                        },
                    },
                    itemStyle: {
                        color: '#fff092',
                    },
                    areaStyle: {
                        color: 'rgba(23,242,195,0.3)',
                    },
                },
            ],
        },
    ],
}