Echarts 初踩坑 stack 折线图不交叉
2019-07-09 本文已影响1人
肆意木
项目中用到了 Echarts,然后发现图表不对,可以到 echarts 官网上查看,https://echarts.baidu.com/examples/editor.html?c=line-stack
option = {
title: {
text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['直接访问','搜索引擎']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一','周二','周三','周四','周五','周六','周日']
},
yAxis: {
type: 'value'
},
series: [
{
name:'直接访问',
type:'line',
stack: '总量',
data:[320, 332, 301, 334, 390, 330, 320]
},
{
name:'搜索引擎',
type:'line',
stack: '总量',
data:[0, 0, 0, 0, 1290, 0, 0]
}
]
};
最后一步步查找,原来是 stack 的原因,stack 值为 ‘总量是’,折线图堆叠(第二条线的数值=本身的数值+第一条线的数值,第三条的数值=第二条线图上的数值+本身的数值,以此类推......)显示,修改值或者直接删除这个属性,就不会折叠显示。