ECharts 雷達圖怎么在類目值下面顯示數值

需要實現的效果：

官網里面的demo顯示數值，都是在拐點處：

【解決】

1、只顯示類目

　　　　　<div id="mychart" style="width:300px;height:300px;margin:0 auto;"></div>
        <script>
            var arr1 = [60,73,85,40,60];
            var arr2 = [23,90,23,32,67];
            var mychart =  echarts.init(document.getElementById('mychart'));
            var option = {
                radar: [
                    {
                        indicator: [
                            {text: '品牌', max: 100},
                            {text: '內容', max: 100},
                            {text: '可用性', max: 100},
                            {text: '功能', max: 100},
                            {text: '屏幕', max: 100}
                        ],
                        center: ['50%','54%'],//調整雷達圖的位置
                        radius: 80,//半徑，可放大放小雷達圖
                        axisLine: {//坐標軸線相關設置
                            show: true,
                            lineStyle: {
                                color: 'red'
                            }
                        },
                        splitLine : {
                            show : true,
                            lineStyle : {
                                width : 1,
                                color : 'red' // 圖表背景網格線的顏色
                            }
                        },
                        splitArea: {
                            show: false,
                        },
                        name: { rich: { a: { color: 'red', lineHeight: 20 }, },  formatter: (a)=>{ return `{a|${a}}` } }
                    },
                ],
                series: [
                    {
                        type: 'radar',
                        symbol: 'none',//去掉拐點的圈
                        data: [
                            {
                                value: arr1,
                                name: '某軟件',
                                areaStyle: {
                                    normal: {
                                        color: 'blue'
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)"
                                },
                            },{
                                value: arr2,
                                name:'jja',
                                areaStyle: {
                                    normal: {
                                        color: 'red' // 圖表中各個圖區域的顏色
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)" // 圖表中各個圖區域的邊框線顏色
                                },
                            }
                        ]
                    },
                ]
            };
            mychart.setOption(option);
        </script>

實現效果：

2、實現最簡單的數值在類目下

<div id="mychart" style="width:300px;height:300px;margin:0 auto;"></div>
        <script>
            var arr1 = [60,73,85,40,60];
            var arr2 = [23,90,23,32,67];
            var mychart =  echarts.init(document.getElementById('mychart'));
            var option = {
                radar: [
                    {
                        indicator: [
                            {text: '品牌', max: 100},
                            {text: '內容', max: 100},
                            {text: '可用性', max: 100},
                            {text: '功能', max: 100},
                            {text: '屏幕', max: 100}
                        ],
                        center: ['50%','54%'],//調整雷達圖的位置
                        radius: 80,//半徑，可放大放小雷達圖
                        axisLine: {//坐標軸線相關設置
                            show: true,
                            lineStyle: {
                                color: 'red'
                            }
                        },
                        splitLine : {
                            show : true,
                            lineStyle : {
                                width : 1,
                                color : 'red' // 圖表背景網格線的顏色
                            }
                        },
                        splitArea: {
                            show: false,
                        },
                        name: { rich: { a: { color: 'red', lineHeight: 20 }, b: { color: '#fff', align: 'center', backgroundColor: '#666', padding: 2, borderRadius: 4 } }, formatter: (a,b)=>{ return `{a|${a}}\n{b|999}` } }
                    },
                ],
                series: [
                    {
                        type: 'radar',
                        symbol: 'none',//去掉拐點的圈
                        data: [
                            {
                                value: arr1,
                                name: '某軟件',
                                areaStyle: {
                                    normal: {
                                        color: 'blue'
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)"
                                },
                            },{
                                value: arr2,
                                name:'jja',
                                areaStyle: {
                                    normal: {
                                        color: 'red' // 圖表中各個圖區域的顏色
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)" // 圖表中各個圖區域的邊框線顏色
                                },
                            }
                        ]
                    },
                ]
            };
            mychart.setOption(option);
        </script>

3、實現最終效果

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <title></title>
        <script src="js/jquery.min.js"></script>
        <script src="js/echarts.js"></script>
    </head>
    <body>
        <div id="mychart" style="width:300px;height:300px;margin:0 auto;"></div>
        <script>
            var arr1 = [60,73,85,40,60]; var arr2 = [23,90,23,32,67]; var mychart =  echarts.init(document.getElementById('mychart'));
            var option = {
                radar: [
                    {
                        indicator: [
                            {text: '品牌', max: 100},
                            {text: '內容', max: 100},
                            {text: '可用性', max: 100},
                            {text: '功能', max: 100},
                            {text: '屏幕', max: 100}
                        ],
                        center: ['50%','54%'],//調整雷達圖的位置
                        radius: 80,//半徑，可放大放小雷達圖
                        axisLine: {//坐標軸線相關設置
                            show: true,
                            lineStyle: {
                                color: 'red'
                            }
                        },
                        splitLine : {
                            show : true,
                            lineStyle : {
                                width : 1,
                                color : 'red' // 圖表背景網格線的顏色
                            }
                        },
                        splitArea: {
                            show: false,
                        },
                    },
                ],
                series: [
                    {
                        type: 'radar',
                        symbol: 'none',//去掉拐點的圈
                        data: [
                            {
                                value: arr1,
                                name: '某軟件',
                                areaStyle: {
                                    normal: {
                                        color: 'blue'
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)"
                                },
                            },{
                                value: arr2,
                                name:'jja',
                                areaStyle: {
                                    normal: {
                                        color: 'red' // 圖表中各個圖區域的顏色
                                    }
                                },
                                lineStyle: {
                                    color:"rgba(255,255,255,0)" // 圖表中各個圖區域的邊框線顏色
                                },
                            }
                        ]
                    },
                ]
            };
            mychart.setOption(option);
            var i = -1;
            mychart.setOption({ radar: [ { name: { rich: { a: { color: 'red', lineHeight: 20 }, b: { color: '#fff', align: 'center', backgroundColor: '#666', padding: 2, borderRadius: 4 } },  formatter: (a,b)=>{ i++; return `{a|${a}}\n{b|${arr1[i]}}` } } } ] }) </script>
    </body>
</html>

效果：