显示ChartJS时间序列中没有数据的时间戳之间的间隔

Question

简而言之，我有包含数据（y）和时间戳（t）的事件，我想在图表上显示它们。

当前，如果我有三个事件：

• 10:00 AM: 42
• 11:00 AM: 43
• 11:20 AM: 44

图表不会显示有数据缺口（我指的是一小时的缺口），而只是将它们连接起来。

例如，在下面的示例中，晚上10点到凌晨5点之间存在间隙。

如果两点之间的间隔超过0秒，是否可以自动显示X值？

var ctx = document.getElementById('chart').getContext("2d");

var data = [
  {
    "y": "0.58",
    "t": 1565665819571
  },
  {
    "y": "0.84",
    "t": 1565665218436
  },
  {
    "y": "1.69",
    "t": 1565664625228
  },
  {
    "y": "0.24",
    "t": 1565640019245
  },
  {
    "y": "0.24",
    "t": 1565639418937
  },
  {
    "y": "0.25",
    "t": 1565638819713
  },
  {
    "y": "0.25",
    "t": 1565638219190
  },
  {
    "y": "0.23",
    "t": 1565637619961
  },
  {
    "y": "0.24",
    "t": 1565637018574
  },
  {
    "y": "0.24",
    "t": 1565636426432
  },
  {
    "y": "0.24",
    "t": 1565635825187
  },
  {
    "y": "0.25",
    "t": 1565635218607
  },
  {
    "y": "0.25",
    "t": 1565634618853
  },
  {
    "y": "0.26",
    "t": 1565634020604
  },
  {
    "y": "0.26",
    "t": 1565633419088
  },
  {
    "y": "0.27",
    "t": 1565632819216
  },
  {
    "y": "0.27",
    "t": 1565632218830
  },
  {
    "y": "0.28",
    "t": 1565631620692
  },
  {
    "y": "0.29",
    "t": 1565631019620
  },
  {
    "y": "0.29",
    "t": 1565630418738
  },
  {
    "y": "0.30",
    "t": 1565629818050
  },
  {
    "y": "0.31",
    "t": 1565629218872
  },
  {
    "y": "0.33",
    "t": 1565628126871
  }
]

var chart = new Chart(ctx, {
  "type": "line",
  "data": {
    "datasets": [
      {
        "label": "Foo",
        "backgroundColor": "lightblue",
        "borderColor": "blue",
        "data": data,
        "type": "line",
        "pointRadius": 0,
        "fill": false,
        "lineTension": 0,
        "borderWidth": 2,
        "spanGaps": false
      }
    ]
  },
  "options": {
    "scales": {
      "xAxes": [
        {
          "type": "time",
          "distribution": "series",
          "ticks": {
            "source": "data",
            "autoSkip": true
          }
        }
      ],
      "yAxes": [
        {
          "scaleLabel": {
            "display": true,
            "labelString": "Y"
          }
        }
      ]
    },
    "tooltips": {
      "intersect": false,
      "mode": "index",
      "callbacks": {}
    }
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js"></script>
<canvas id="chart"></canvas>