eachrt 雷达图背景颜色填充,线条颜色自定义【在线调试】
程序员文章站
2024-03-19 23:15:16
...
效果
option = {
title : {
text: '预算 vs 开销(Budget vs spending)',
subtext: '纯属虚构'
},
tooltip : {
trigger: 'axis'
},
legend: {
orient : 'vertical',
x : 'right',
y : 'bottom',
data:['预算分配(Allocated Budget)','实际开销(Actual Spending)']
},
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
restore : {show: true},
saveAsImage : {show: true}
}
},
polar : [
{
indicator : [
{ text: '销售(sales)', max: 6000},
{ text: '管理(Administration)', max: 16000},
{ text: '信息技术(Information Techology)', max: 30000},
{ text: '客服(Customer Support)', max: 38000},
{ text: '研发(Development)', max: 52000},
{ text: '市场(Marketing)', max: 25000}
],
splitArea : {
show : true,
areaStyle : {
color: ['#d72941', '#f1c35b','#99c736', '#75813b', '#4e3829',]
// 图表背景网格的颜色
}
},
splitLine : {
show : true,
lineStyle : {
width : 1,
color : ['#7954a1','#ef91ab']
// 图表背景网格线的颜色
}
}
}
],
calculable : true,
series : [
{
name: '预算 vs 开销(Budget vs spending)',
type: 'radar',
data : [
{
value : [4300, 10000, 28000, 35000, 50000, 19000],
name : '预算分配(Allocated Budget)'
},
{
value : [5000, 14000, 28000, 31000, 42000, 21000],
name : '实际开销(Actual Spending)'
}
]
}
]
};