画折线图时,折线用默认主题太单调啦,而且过六个还重复!太丑了,不符合我审美!
怎么改变折线的颜色呢,其实很简单,代码如下:
在series里给每条折线加个itemStyle即可:
itemStyle: {
normal: {
color: '#a80000', //改变折线点的颜色
lineStyle: {
color: '#a80000' //改变折线颜色
}
}
},
完整代码为:
series: [
{
name: "意大利",
type: 'line',
data: a,
itemStyle: {
normal: {
color: '#a80000', //改变折线点的颜色
lineStyle: {
color: '#a80000' //改变折线颜色
}
}
},
},
{
name: '巴西',
type: 'line',
data: b,
itemStyle: {
normal: {
color: '#ff6f73', //改变折线点的颜色
lineStyle: {
color: '#ff6f73' //改变折线颜色
}
}
},
},
{
name: '西班牙',
type: 'line',
data: c,
itemStyle: {
normal: {
color: '#ffa438', //改变折线点的颜色
lineStyle: {
color: '#ffa438' //改变折线颜色
}
}
},
},
{
name: '德国',
type: 'line',
data: d,
itemStyle: {
normal: {
color: '#ffda42', //改变折线点的颜色
lineStyle: {
color: '#ffda42' //改变折线颜色
}
}
},
},
{
name: '英国',
type: 'line',
data: e,
itemStyle: {
normal: {
color: '#db63c2', //改变折线点的颜色
lineStyle: {
color: '#db63c2' //改变折线颜色
}
}
},
},
{
name: '法国',
type: 'line',
data: f,
itemStyle: {
normal: {
color: '#8763f3', //改变折线点的颜色
lineStyle: {
color: '#8763f3' //改变折线颜色
}
}
},
},
{
name: '美国',
type: 'line',
data: g,
itemStyle: {
normal: {
color: '#5087ff', //改变折线点的颜色
lineStyle: {
color: '#5087ff' //改变折线颜色
}
}
},
},
{
name: '俄罗斯',
type: 'line',
data: h,
itemStyle: {
normal: {
color: '#47b8ff', //改变折线点的颜色
lineStyle: {
color: '#47b8ff' //改变折线颜色
}
}
},
}
]
选几个对比度打的颜色就好啦!
实现效果如下: