主要就是 gridIndex: 1 和xAxisIndex: 1,yAxisIndex: 1.
option = {
title: {text: 'Step Line'},
tooltip: {trigger: 'axis'},
legend: {data: ['Step Start', 'Step Middle', 'Step End']
},
grid: [{
bottom: "50%",
containLabel: true
}
,
{
top: '60%',
containLabel: true
}],
toolbox: {
feature: {saveAsImage: {}
}
},
xAxis: [{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
},
{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Wed', 'Fri', 'Sat', 'Sun'],
gridIndex: 1
}],
yAxis: [{type: 'value'},{
type: 'value',
gridIndex: 1
}],
series: [
{
type: 'line',
data: [120, 132, 101, 134, 90, 230, 210]
},
{
type: 'line',
// step: 'middle',
data: [220, 282, 201, 234, 290, 430, 410]
},
{
type: 'line',
data: [450, 432, 401, 454, 590, 530, 510],
},
{
name: 'Step Start',
type: 'line',
// step: 'start',
data: [120, 132, 101, 134, 90, 230, 210],
xAxisIndex: 1,
yAxisIndex: 1
},
{
type: 'line',
data: [220, 282, 201, 234, 290, 430, 410],
xAxisIndex: 1,
yAxisIndex: 1
},
{
type: 'line',
data: [450, 432, 401, 454, 590, 530, 510],
xAxisIndex: 1,
yAxisIndex: 1
}
]
};效果图：