階梯線圖

一般的線圖會直接用直線連接兩個點,而階梯線圖(又稱方波圖)只使用水平線和垂直線來連接相鄰的項目。相較於一般的線圖,階梯線圖更能清楚地顯示分析資料的突然變化。

在 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]
    }
  ]
};
即時預覽

請注意三種不同類型線條之間的差異。

貢獻者 在 GitHub 上編輯此頁面

pissang pissang