var option = {
radar: [{
indicator: [{
text: 'a頻率 \n (高於60%的用戶)',
max: 1000
},
{
name: 'b成功率 \n (高於65%的用戶)',
max:1000
},
{
name: 'c率 \n (低於40%的用戶)',
max:1000
},
{
name: 'd能力 \n (低於10%的用戶)',
max:1000
},
{
name: 'e能力 \n (低於30%的用戶)',
max:1000
}
],
center: ['46%', '50%'], // 位置
radius: 70, //大小
startAngle: 90, // 雷達圖的旋轉偏移量
splitNumber: 5, // 分層5層,當前最大1000,可理解爲每層200
shape: 'line',
name: {
formatter: '{value}',
textStyle: {
color: '#595959', // 文字顏色
fontSize: 13
}
},
splitArea: {
areaStyle: {
color: ['#FFFFFF','#EEEEEE', '#FFFFFF','#EEEEEE', '#FFFFFF']
//圓環顏色
}
},
axisLine: {
lineStyle: {
color: 'rgba(128, 128, 128, 0.1)' // 五角內部的連接線顏色
}
},
splitLine: {
lineStyle: {
color: '#595959' // 每個區域的邊框顏色
}
}
}],
series: [{
name: '雷達圖',
type: 'radar',
itemStyle: {
emphasis: {
// color: 各異,
lineStyle: {
width: 4
}
}
},
data: [{
value: [200, 400, 600, 800, 1000], // 排序從頂部→左→左下角→右下角→右側
lineStyle: { // 五點連接線的樣式。
normal: {
opacity: 1, // 圖形透明度,
color: '#1F6AFB'
}
},
itemStyle: { // 單個拐點標誌的樣式設置。
normal: {
borderColor: '#1F6AFB',
// 拐點的描邊顏色。[ default: '#000' ]
borderWidth: 3,
// 拐點的描邊寬度,默認不描邊。[ default: 0 ]
}
},
areaStyle: {
normal: {
color: 'rgba(128, 128, 128, 0.1)' // 五點連接後形成的區域顏色: 透明色
}
}
}]
}]
}
效果圖: