javascript - Highcharts:在x轴上设置规则间隔

Question

我有一系列随时间变化的数据值(由计数确定)。数据以 n 分钟间隔提供(计数 x 间隔)；通常，数据将为 96 x 15(96 个 15 分钟间隔为 24 小时)。间隔的长度和计数都是动态的。数据系列可以是多种类型的数据；它可以采用多种格式，例如 0.000123 或 1.23 或 198763.0000089675。

我希望我的 xaxis 以 1 小时的间隔显示时间(屏幕空间很小，因此可能需要 2 小时的间隔)。我有这个:

xAxis: {
    type : 'datetime',
    title: {
        text: 'Time ('+period+')'
        },
    dateTimeLabelFormats: {
        minute: '%H:%M',
        hour: '%H:%M'
        }
}

以及这样的系列:

[15999.999999999996,14999.999999999996,15999.999999999996,14999.999999999996,13999.999999999996,15999.999999999996,17999.999999999993,17999.999999999993,16999.999999999993,15999.999999999996,16999.999999999993,14999.999999999996,14999.999999999996,13999.999999999996,14999.999999999996,14999.999999999996,14999.999999999996,14999.999999999996,15999.999999999996,19999.999999999993,23999.999999999993,27999.999999999993,24999.999999999993,22999.999999999993,21999.999999999993,23999.999999999993,29999.999999999993,26999.999999999993,29999.999999999993,31999.999999999993,34999.999999999985,31999.999999999993,31999.999999999993,33999.999999999985,34999.999999999985,32999.999999999985,32999.99999999998,32999.99999999997,32999.99999999997,32999.99999999997,32999.999999999985,32999.999999999985,34999.999999999985,32999.999999999985,32999.999999999985,32999.999999999985,35999.999999999985,32999.999999999985,35999.999999999985,32999.999999999985,33999.999999999985,30999.999999999993,28999.999999999993,31999.999999999993,32999.999999999985,33999.999999999985,30999.999999999993,32999.999999999985,32999.999999999985,30999.999999999993,30999.999999999993,31999.999999999993,31999.999999999993,29999.999999999993,29999.999999999993,30999.999999999993,30999.999999999993,26999.999999999993,25999.999999999993,27999.999999999993,29999.999999999993,27999.999999999993,26999.999999999993,25999.999999999993,26999.999999999993,27999.999999999993,25999.999999999993,28999.999999999993,29999.999999999993,26999.999999999993,24999.999999999993,18999.999999999993,17999.999999999993,16999.999999999993,16999.999999999993,15999.999999999996,16999.999999999993,15999.999999999996,14999.999999999996,15999.999999999996,15999.999999999996,14999.999999999996,14999.999999999996,15999.999999999996,15999.999999999996,14999.999999999996]

但 x 轴上的值为:

00:00:00.020    00:00:00.040     00:00:00.020    00:00:00.020

我已经研究过 highcharts API，但我无法完全了解它如何处理时间序列。

如何让 highcharts 正确显示时间？

Answer 1

如果轴的类型为日期时间，那么图表将以它认为合适的最佳方式呈现它们。如果您不喜欢它们的呈现方式，您可以使用 dateTimeLabelFormats 控制图表的日期时间格式。就像你已经在做的那样。

根据当时数据的日期时间跨度，图表将选择以下默认格式之一:

second: '%H:%M:%S',
minute: '%H:%M',
hour: '%H:%M',
day: '%e. %b',
week: '%e. %b',
month: '%b \'%y',
year: '%Y'

如果您想将它们全部强制为小时和分钟，无论范围如何，请按如下方式设置:

second: '%H:%M',
minute: '%H:%M',
hour: '%H:%M',
day: '%H:%M',
week: '%H:%M',
month: '%H:%M',
year: '%H:%M'

要控制显示日期的间隔，请使用 tickInterval 。因为你的轴是类型datetime 您必须使用毫秒作为tickInterval 的单位。因此，以毫秒为单位的 1 小时刻度间隔为 3600000。如果您希望它为 2 小时，则使用 7200000。