階梯線圖
普通折線圖直接用直線連線兩個資料點,而階梯線圖(也稱為方波圖)僅使用水平和垂直的線將相鄰的資料點連線起來。與普通折線圖相比,階梯線圖可以更清晰地顯示資料變化的突變情況。
在 ECharts 中,我們使用 step
來配置階梯線圖的連線型別。它有三個可選值:'start'
、'end'
和 'middle'
。對於資料點 A 和 B,這些值分別對應拐點在 A、B 以及 A 和 B 的中點。
option = { legend: {}, xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [ { name: 'Step Start', type: 'line', step: 'start', data: [120, 132, 101, 134, 90, 230, 210] }, { name: 'Step Middle', type: 'line', step: 'middle', data: [220, 282, 201, 234, 290, 430, 410] }, { name: 'Step End', type: 'line', step: 'end', data: [450, 432, 401, 454, 590, 530, 510] } ] };
線上示例
請注意以下三種不同型別線上條上的差異。