function createRadarChart(indicatorData, personData) {
var myChart = echarts.init(document.getElementById('fl2Grid')); var option = {
legend: {//图例设置
data: [{ name: personData[0].name, icon: 'rect' }, { name: personData[1].name, icon: 'rect' }],//名字和图形
left: 0,
itemGap: 30,
itemWidth: 14
},
radar: {//雷达图形设置
name: {
textStyle: {
color: '#333333'
}
},
indicator: indicatorData,//雷达数据最大值
splitArea: {
show: false //是否显示隔断色
},
splitLine: {
lineStyle: {
color: ['#D1D1D1']//雷达的线条色
}
}
},
series: [{
type: 'radar',
data: [{
value: personData[0].value,//第一个数据线条
name: personData[0].name,
lineStyle: {
normal: {
color: '#e4b2b2'
}
},
lineStyle: {
normal: {
color: '#E4B2B2'
}
},
areaStyle: {
normal: {
color: 'rgba(255,47,47,.3)'
}
}
}, {
value: personData[1].value,//第二个数据线条
name: personData[1].name,
itemStyle: {
normal: {
color: '#FF5758'
}
},
itemStyle: {
normal: {
color: '#FFD52F'
}
},
areaStyle: {
normal: {
color: 'rgba(255,204,51,.5)'
}
}
}]
}]
};;
myChart.setOption(option);
}
//生成雷达图
var indicatorData = [//雷达图最大值设置
{ name: '客户向导', max: 10 },
{ name: '信任协作', max: 10 },
{ name: '鼓励创新', max: 10 },
{ name: '高效执行', max: 10 },
{ name: '战略选择', max: 10 },
{ name: '精细管理', max: 10 },
{ name: '成就团队', max: 10 },
{ name: '专 业 力', max: 10 },
{ name: '学习敏锐度', max: 10 },
{ name: '客户向导', max: 10 }
];
//具体的雷达图数据
var personData = [{ name: '王二三', value: [2.7, 5.2, 3.3, 7.8, 3.5, 6.5, 6.6, 3.4, 7.9, 4.8] }, { name: '平均', value: [3.7, 4.2, 6.3, 6.8, 3.2, 8.5, 7.6, 8.4, 5.9, 4.8] }]; createRadarChart(indicatorData, personData);//执行函数
05-11 20:13