echarts 雷达图

浅浅的花香味﹌ 2022-01-06 00:45 407阅读 0赞

var evalateStaTableOption = {
            title: {
                // text: '基础雷达图'
            },
    
            tooltip : {
                trigger: 'radar'
            },
            color:['#ff6384','#95a5a6'],//这里需要和下面lineStyle的颜色设置一致了才行
            legend: {
                data: ['目标值', '实际值'],
                orient: 'vertical',
                right: '10%',
                top: '2%'
            },
            radar: {
                shape: 'circle',
                name: {
                    textStyle: {
                        color: '#000',
                        backgroundColor: '#f2f2f2',
                        borderRadius: 3,
                        padding: [3, 5] //文字的颜色
                   }
                },
                center:['50%','54%'],
                indicator: [
                   { name: '指数1', max: 2}, { name: '指数2', max: 1.5}, { name: '指数3', max: 1.5}, { name: '过率4', max: 1.5}, { name: '组率', max: 1.5}
                ],
                splitArea : {
                    show : false,
                    areaStyle : {
                        color: 'rgba(0,255,158,0)' // 图表背景的颜色
                    }
                },
                splitLine : {
                    show : true,
                    lineStyle : {
                        width : 1,
                        color : '#e6e6e6' // 设置网格的颜色
                    }
                },
                lineStyle:{
                    normal:{
                        color:'red'
                    }
                }
            },
            series: [{
                name: '目标值 vs实际值',
                type: 'radar',
    
                data : [
                    {
                        value : [1.5, 0.9, 1, 0.8, 0.8],
                        name : '目标值',
                        itemStyle: {
                            color:'#ff6384',
                            normal: {
                                lineStyle: {
                                    width: 1,
                                    color: '#ff6384'
                                }
                            }
                        }
                    },
                    {
                        value : [1.3, 0.8, 0.9, 0.7, 0.9],
                        name : '实际值',
                        itemStyle: {
                            color:'#95a5a6',
                            normal: {
                                lineStyle: {
                                    width: 1,
                                    color: '#95a5a6'
                                }
                            }
                        }
                    }
                ]
            }]
        };

转载于:https://www.cnblogs.com/slfmeimei/p/10723294.html