echarts 雷达图如何展示百分比

Question

option = {
        tooltip: {
        },

        radar: {
            shape: 'polygon',
            radius: '60%',
            center: ['50%', '50%'],
            name: {
                textStyle: {
                    color: '#818181'
                }
            },
            axisLine: {
                lineStyle: {
                    color: '#1e88e5',
                }
            },
            splitLine: {
                lineStyle: {
                    color: '#1e88e5',
                }
            },
            splitArea: {
                areaStyle: {
                    color: ['#f4f8ff', '#e0ebff']
                }
            },
            indicator: [{
                name: '白羊座',
                max: 6500
            }, {
                name: '金牛座',
                max: 6500
            }, {
                name: '巨蟹座',
                max: 6500
            }, {
                name: '双子座',
                max: 6500
            }, {
                name: '双鱼座',
                max: 6500
            }, {
                name: '水瓶座',
                max: 6500
            }, {
                name: '射手座',
                max: 6500
            }, {
                name: '狮子座',
                max: 6500
            }, {
                name: '处女座',
                max: 6500
            }, {
                name: '天蝎座',
                max: 6500
            }, {
                name: '天秤座',
                max: 6500
            }, {
                name: '摩羯座',
                max: 6500
            }]
        },
        series: [{
            name: '粉丝星座',
            type: 'radar',
            lineStyle: {
                normal: {
                    color: '#2dc76d',
                }
            },
            itemStyle: {
                normal: {
                    color: '#2dc76d',
                },
                formatter: '{c}%'
            },
            areaStyle: {
                normal: {
                    color: '#2dc76d',
                    opacity: 0.5
                }
                
            },
            data: [{
                    value: [4100, 4300, 4300, 4300, 4300, 4300, 4300, 4300, 4300, 4300, 4300, 4300],
                    name: '粉丝星座'
                },

            ]
        }]
    }

如何将此option 用echarts展示成百分比... 弄了半天了

Answer 1

option = {

title: {
    text: '多雷达图'
},
tooltip: {
    trigger: 'axis',
},
legend: {
    x: 'center',
    data:['某软件','某主食手机','某水果手机','降水量','蒸发量']
},
radar: [
    {
        indicator: [
            {text: '品牌', max: 100},
            {text: '内容', max: 100},
            {text: '可用性', max: 100},
            {text: '功能', max: 100}
        ],
        center: ['25%','40%'],
        radius: 80
    },
    {
        indicator: [
            {text: '外观', max: 100},
            {text: '拍照', max: 100},
            {text: '系统', max: 100},
            {text: '性能', max: 100},
            {text: '屏幕', max: 100}
        ],
        radius: 80,
        center: ['50%','60%'],
    },
    {
        indicator: (function (){
            var res = [];
            for (var i = 1; i <= 12; i++) {
                res.push({text:i+'月',max:100});
            }
            return res;
        })(),
        center: ['75%','40%'],
        radius: 80
    }
],
series: [
    {
        type: 'radar',
         tooltip: {
            trigger: 'item',
            formatter: function(a){
                        console.log(a);
                        var name=['外观','拍照','系统','性能'];
                        str = a.name+'<br>'
                        var data = a.value
                        var value = data.reduce(function(a,b){
                            return a+b;
                        })
                        
                        for(var i=0;i<name.length;i++){
                            str += name[i]+' ' + ((data[i]/value) * 100).toFixed(2) + '% <br>' 
                        }
                        return str
                    }
        },
        itemStyle: {
            normal: {areaStyle: {type: 'default'}},
            label: {  
                    show: true,  
                    position: 'top',  
                    

                }  
            
        },
        data: [
            {
                value: [60,73,85,40],
                name: '某软件'
            }
        ]
    },
    {
        type: 'radar',
        radarIndex: 1,
        data: [
            {
                value: [85, 90, 90, 95, 95],
                name: '某主食手机'
            },
            {
                value: [95, 80, 95, 90, 93],
                name: '某水果手机'
            }
        ]
    },
    {
        type: 'radar',
        radarIndex: 2,
        itemStyle: {normal: {areaStyle: {type: 'default'}}},
        data: [
            {
                name: '降水量',
                value: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 75.6, 82.2, 48.7, 18.8, 6.0, 2.3],
            },
            {
                name:'蒸发量',
                value:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 35.6, 62.2, 32.6, 20.0, 6.4, 3.3]
            }
        ]
    }
]

};

Answer 2

请问解决了吗？我的雷达图也遇上了这个问题