echars 柱状图时间堆积图 y轴24小时

如果您想在 ECharts 中显示时间堆积图，并且将 y 轴设置为 24 小时的时间轴，可以按照以下步骤操作：

1. 引入 ECharts 库。

<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>

2. 准备数据。时间数据可以使用 JavaScript 中的 Date 对象表示。

var data1 = [
  ['2021-01-01 00:00:00', 2],
  ['2021-01-01 01:00:00', 3],
  ['2021-01-01 02:00:00', 4],
  ['2021-01-01 03:00:00', 5],
  ['2021-01-01 04:00:00', 6],
  // ...
  ['2021-01-01 22:00:00', 3],
  ['2021-01-01 23:00:00', 2]
];

var data2 = [
  ['2021-01-01 00:00:00', 1],
  ['2021-01-01 01:00:00', 2],
  ['2021-01-01 02:00:00', 3],
  ['2021-01-01 03:00:00', 4],
  ['2021-01-01 04:00:00', 5],
  // ...
  ['2021-01-01 22:00:00', 2],
  ['2021-01-01 23:00:00', 1]
];

3. 配置 ECharts 图表。

var chart = echarts.init(document.getElementById('chart'));

var option = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {
    data: ['数据1', '数据2']
  },
  xAxis: {
    type: 'time',
    splitLine: {
      show: false
    }
  },
  yAxis: {
    type: 'value',
    min: 0,
    max: 24,
    interval: 1
  },
  series: [{
    name: '数据1',
    type: 'bar',
    stack: '总量',
    data: data1
  }, {
    name: '数据2',
    type: 'bar',
    stack: '总量',
    data: data2
  }]
};

chart.setOption(option);

这样就可以在 ECharts 图表中显示时间堆积图，并将 y 轴设置为 24 小时的时间轴了。需要注意的是，这里将 y 轴的最小值设置为 0，最大值设置为 24，间隔设置为 1，这样就可以按照小时来显示 y 轴了。同时，由于是堆积图，需要设置 `stack` 属性为相同的值，这里设置为 `'总量'`。