echarts 雷达图 圆上显示 标识值

var titleList=["说明讨论的目的","明确表达绩效挑战","维持动力","促进参与","提供支持","制定行动计划 ","达成共识"];

var list1=[13,24,18,21,21,21,19] ;

var list2=[13,21,21,21,24,18,18];

var options={
    title: {text:null,},
    tooltip: {},
    legend: {show:'false',},
    radar: [{
            indicator: (function (){
                var res = [];
                for (var i = 0; i < titleList.length; i++) {
                    var color;var axisLabel_show;
                    if(i==0){
                      axisLabel_show=true;    
                    }else{
                      axisLabel_show=false;
                    }
                    if(titleList[i].replace(/\s+/g,"")==advantage.replace(/\s+/g,"")){
                        color='#84d66e';
                    }else if(titleList[i].replace(/\s+/g,"")==Inferiority.replace(/\s+/g,"")){
                        color='#ff7d7d';
                    }else{
                        color='#8d8d8d';
                    }
                    res.push({name:titleList[i],max:24,color:color,axisLabel:{show:axisLabel_show}});
                }
                return res;
            })(),
        radius: 110,
        startAngle: 90,
        splitNumber: 6,
        shape: 'circle',
        triggerEvent: true,
        silent: true,
        scale: true,
        nameGap:12,
        splitArea: {
            show : true,   
            areaStyle : {
                color: ["#fff"]  // 图表背景网格的颜色
            }
        },
        axisTick:{
          show:true  
        },
        axisLabel:{
          show:true,
          color:'#b6b1c3',
          position: 'bottom'
        },
    }],
    series: [{
            name: '能力诊断(前测)vs 能力考核(后测)',
            type: 'radar',
            // symbol: 'circle',  //设置拐点格式样式 如:实心圆,空心圆或不显示拐点等
            
            areaStyle: {normal: {}},     
            axisLine: {// 设置雷达图中间射线的颜色
                lineStyle: {
                    color: 'rgba(131,141,158,.1)',
                },
            },
            data : [
                {
                    value : list1,
                    name : { text:'能力诊断(前测)' },
                    symbolSize :0, //设置各个拐点的大小
                    label: {
                        normal: {
                            show: false,
                            color:'#585756',
                            position: 'top'
                        }
                    },
                    areaStyle: {
                        normal: {
                            color:'rgba(166,51,247,.2)'
                        }
                    },
                    // 设置区域边框和区域的颜色
                    itemStyle: {
                        normal: {
                            lineStyle:{
                                color:'#b6b1c3'
                            },
                            color:'rgba(166,51,247,.3)'
                        }
                    }, 
                },
                 {
                    value : list2,
                    name : { text:'能力考核(后测)' },
                    symbolSize :0, //设置各个拐点的大小
                    label: {
                        normal: {
                            show: false,
                            color:'#585756',
                            position: 'bottom'
                        }
                    },
                    areaStyle: {
                        normal: {
                            color:'rgba(77,224,181,.3)'
                        }
                    },
                    itemStyle: {
                        normal: {
                            lineStyle:{
                                color:'#b6b1c3'
                            },
                            color:'#2ac5cb',
                        }
                    }, 
                }
            ]
        }]
            
    };

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值