为什么我的图表会绘制额外的 x 轴宽度？

Question

我在项目中使用 antd Charts 来绘制时间序列数据。我的数据仅在晚上 18:30 之前有数据点，但 antd 折线图绘制了额外的 x 轴宽度，这使得它看起来像是数据丢失了。

这是我的配置：

 const config = {
    width: window.innerWidth - 100,
    data: res,
    xField: 'time',
    yField: 'value',
    seriesField: 'key',
    yAxis: {
      title: { position: 'center', text: labelText, autoRotate: true },
      grid: {
        line: {
          style: {
            stroke: '#ddd',
          },
        },
      },
    },
    xAxis: {
      type: 'time',
      mask: 'HH:mm Z',
      label: {
        formatter: (value) => {
          if (timezone === 'utc') {
            return moment(value, 'HH:mm ZZ').utc().format('HH:mm Z');
          }
          return moment(value, 'HH:mm').format('HH:mm Z');
        },
      },
      grid: {
        line: {
          style: {
            stroke: '#ddd',
          },
        },
      },
    },
    tooltip: {
      customItems: (originalItems) => {
        return originalItems.sort(function (a, b) {
          return b.value - a.value;
        });
      },
    },
  };

如何去除 18:30 到 18:47 之间多余的 x 轴部分

Answer 1

删除类型也对我有用，但不知道为什么 antd 中存在这种行为