echarts:x轴为时间轴时，设置间隔时间

前言

项目中有个需求，需要用坐标轴展示数据随着时间变化，x轴为时间，y轴为数值。

这里选择了echarts,一个基于 JavaScript 的开源可视化图表库

官方地址：echarts.apache.org/zh/index.ht…

问题

根据文档，我将x轴设置type=time，x轴配置如下

    xAxis: {
      type: "time",
      min: 1704038400000,
      max: 1704038460000,
      axisLabel: {
        show: true,
        showMaxLabel: true,
        showMinLabel: true,
        formatter: function (val, index) {
          let date = new Date(val); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
          let m =
            (date.getMinutes() < 10
              ? "0" + date.getMinutes()
              : date.getMinutes()) + ":";
          let s =
            date.getSeconds() < 10
              ? "0" + date.getSeconds()
              : date.getSeconds();
          return m + s;
        },
      },
      axisTick: {
        show: false,
      },
      splitLine: {
        show: true,
      },
    }

这时候就发现一个问题，如何调整时间间隔？我需要x轴刻度均分为5个，时间间隔为12s，文档提供了俩个方法，但是都不能达到想要的实现效果。遇事不决查度娘，但是我翻了很久都没找到。

解决

将类型type="time"修改为type="value",这时候使用interval就有效了！！