如何获得Highcharts XAxis以2分钟的间隔显示

Question

我对Highcharts有点陌生，我正在尝试实现我确定可以完成的事情，但我无法弄清楚。

我已经在这里发布了我的jsfiddle：https://jsfiddle.net/dfeagin/1hn6c9ad/7/这是该轴上“我的类别”部分中数据的外观：

categories: ['1/20/2020 9:22:02 PM', '1/20/2020 9:22:03 PM', '1/20/2020 9:22:04 PM', '1/20/2020 9:22:08 PM', '1/20/2020 9:22:09 PM', '1/20/2020 9:22:10 PM', '1/20/2020 9:22:12 PM', '1/20/2020 9:22:14 PM', '1/20/2020 9:22:15 PM', '1/20/2020 9:22:16 PM', '1/20/2020 9:22:18 PM', '1/20/2020 9:22:19 PM'.....] 

在代表分钟的XAxis上，从开始到结束时间范围总共有46分钟。我想显示两分钟的增量，只显示分钟数与日期/时间戳的比较：0 2 4 6 8 10 ..... 42 44 46

我如何才能做到这一点？在这两分钟的增量之间，数据将具有不同数量的数据点，但我希望2分钟间隔保持一致。

[另一注：我正在生成在.net Web应用程序中提供给Highcharts的数据，因此，如果有帮助，我可以发送一系列分钟数与时间/日期戳的对比。所以我可以发送过来：

categories: ['0', '0', '0', '1', '1', '2', '2', '2', '2', '2', '2', '2', '3', ... '43', '43', '43', '44', '44', '45', '45', '45', '45', '45', '45', '45', '46', '46'] 

Answer 1

[我认为您最好将图表设置为样条曲线，而不是使用日期时间x轴将每个系列设置为样条图，并将数据作为日期/值x / y对的数组放入系列中。

这样，在这种情况下，您可以更好地控制xAxis刻度，将刻度间隔设置为2分钟，并且通常更灵活。

使用自定义格式器操作刻度值。

https://jsfiddle.net/gazx45oy/

图表类型：

chart: {
  type: 'spline',

xAxis设置：

xAxis: [{
type: 'datetime',
startOnTick: true,
minPadding: 0,
tickInterval: 120000, 
labels: {
    formatter: function () {
        return (this.value - this.axis.min) / 60000;
    },

系列数据：

var vesselSteamTemp = [
[Date.UTC(2020,20,1,9,22,2), 119],