option = {
tooltip: {
trigger: ‘axis‘,
axisPointer: {
type: ‘cross‘,
crossStyle: {
color: ‘#999‘
}
}
},
legend: {
data: [‘苹果‘, ‘香蕉‘, ‘橘子‘], // 设置具体项
icon:"rect", // 设置legend图标
bottom:"bottom", //设置legend位置
itemGap:50 //设置legend项之间的间距
},
xAxis: [
{
type: ‘category‘,
data: [‘郑州‘, ‘南阳‘, ‘洛阳‘, ‘信阳‘, ‘新乡‘, ‘开封‘, ‘驻马店‘, ‘商丘‘, ‘许昌‘, ‘周口‘, "济源", ‘濮阳‘],
axisPointer: { //设置x轴指示器样式
type: ‘shadow‘
},
axisTick:{show:false},
axisLine:{
lineStyle:{
width:2
}
}
}
],
yAxis: [
{
type: ‘value‘,
min: 0,
max: 250,
interval: 50,
axisTick:{show:false},
axisLine:{show:false}
},
{
type: ‘value‘,
min: 0,
max:50,
interval: 10,
axisLabel: {
formatter: ‘{value} %‘
},
axisTick:{show:false},
axisLine:{show:false}
}
],
series: [
{
name: ‘苹果‘,
type: ‘line‘,
data: [20., 49, 70, 26, 66, 76, 100, 142, 32, 20, 6, 50],
itemStyle:{
color:"#3fa7dc" //设置折线图颜色
},
smooth:true, // 线条是否平滑
symbol:"none", // 是否显示节点
stack:"总量", //areaStyle颜色重叠问题,添加相同的stack属性即可
areaStyle: {
opacity:0.3
}
},
{
name: ‘香蕉‘,
type: ‘line‘,
stack:"总量",
data: [230, 130, 160, 184, 90, 120, 100, 90, 48, 18, 10, 30],
itemStyle:{
color:"orange" //设置折线图颜色
},
smooth:true,
symbol:"none", // 是否显示节点
areaStyle: {
opacity:0.3
}
},
{
name: ‘橘子‘,
type: ‘line‘,
data: [60, 80, 90, 120, 63, 102, 240, 234, 230, 165, 120, 62],
itemStyle:{
color:"#ff3a00" //设置折线图颜色
},
symbolSize:10, // 设置节点大小
symbol:"circle" // 设置节点样式
}
]
};
设置areaStyle属性后,发现颜色重叠,如果不想重叠,给series的项添加相同的stack属性
原文:https://www.cnblogs.com/yunyin/p/13889794.html