Highchart:日期时间X轴标签显示不正确

问题描述 投票:0回答:1

我正在使用highchart来显示带有日期时间x轴的折线图。我已将x轴类型设置为datetime

xAxis: {
        type: 'datetime'
 },

和系列的形式

series: [{"name": "temprature", "data": [[1585898010000, 0], [1585898020000, 0.27], [1585898030000, 0.18], [1585898040000, 0.18], [1585898050000, 0.22], [1585898060000, 0.14], [1585898070000, 0.24], [1585898080000, 0.2], [1585898090000, 0.22], [1585898100000, 0.18], [1585898110000, 0.18], [1585898120000, 0.2], [1585898130000, 0.22], [1585898140000, 0.21], [1585898150000, 0.18], [1585898160000, 0.18], [1585898170000, 0.15], [1585898180000, 0.23], [1585898190000, 0.2], [1585898200000, 0.16], [1585898210000, 0.18], [1585898220000, 0.2], [1585898230000, 0.21], [1585898240000, 0.2], [1585898250000, 0.2], [1585898260000, 0.21], [1585898270000, 0.23], [1585898280000, 0.2], [1585898290000, 0.31], [1585898300000, 0.38], [1585898310000, 0.35], [1585898320000, 0.27], [1585898330000, 0.48], [1585898340000, 0.35], [1585898350000, 0.25], [1585898360000, 0.33], [1585898370000, 0.28], [1585898380000, 0.35], [1585898390000, 0.33], [1585898400000, 0.43], [1585898410000, 0.42], [1585898420000, 0.3], [1585898430000, 1.03], [1585898440000, 0.38], [1585898450000, 0.47], [1585898460000, 0.34], [1585898470000, 0.47], [1585898480000, 0.44], [1585898490000, 0.37], [1585898500000, 0.68], [1585898510000, 0.41], [1585898520000, 0.53], [1585898530000, 0.53], [1585898540000, 1.68], [1585898550000, 0.25], [1585898560000, 0.16], [1585898570000, 0.23], [1585898580000, 0.22], [1585898590000, 0.16], [1585898600000, 0.23], [1585898610000, 0.18], [1585898620000, 0.23], [1585898630000, 0.2], [1585898640000, 0.18], [1585898650000, 0.2], [1585898660000, 0.2], [1585898670000, 0.18], [1585898680000, 0.23], [1585898690000, 0.18], [1585898700000, 0.2], [1585898710000, 0.18], [1585898720000, 0.2], [1585898730000, 0.23], [1585898740000, 0.18], [1585898750000, 0.18], [1585898760000, 0.22], [1585898770000, 0.22], [1585898780000, 0.16], [1585898790000, 0.18], [1585898800000, 0.25], [1585898810000, 0.13], [1585898820000, 0.2], [1585898830000, 0.21], [1585898840000, 0.17], [1585898850000, 0.18], [1585898860000, 0.25], [1585898870000, 0.2], [1585898880000, 0.25], [1585898890000, 0.31], [1585898900000, 0.3], [1585898910000, 0.4], [1585898920000, 0.28], [1585898930000, 0.5], [1585898940000, 0.28], [1585898950000, 0.28], [1585898960000, 0.32], [1585898970000, 0.3], [1585898980000, 0.31], [1585898990000, 0.31], [1585899000000, 0.49], [1585899010000, 0.41], [1585899020000, 0.25], [1585899030000, 1.06], [1585899040000, 0.35], [1585899050000, 0.45], [1585899060000, 0.41], [1585899070000, 0.6], [1585899080000, 0.41], [1585899090000, 0.42], [1585899100000, 0.56], [1585899110000, 0.58], [1585899120000, 0.56], [1585899130000, 0.46], [1585899140000, 1.61], [1585899150000, 0.23], [1585899160000, 0.19], [1585899170000, 0.32], [1585899180000, 0.17], [1585899190000, 0.2], [1585899200000, 0.23], [1585899210000, 0.2], [1585899220000, 0.18], [1585899230000, 0.22], [1585899240000, 0.18], [1585899250000, 0.2], [1585899260000, 0.23], [1585899270000, 0.21], [1585899280000, 0.22], [1585899290000, 0.18], [1585899300000, 0.21], [1585899310000, 0.18], [1585899320000, 0.18], [1585899330000, 0.25], [1585899340000, 0.13], [1585899350000, 0.25], [1585899360000, 0.18], [1585899370000, 0.18], [1585899380000, 0.24], [1585899390000, 0.21], [1585899400000, 0.24], [1585899410000, 0.21], [1585899420000, 0.22], [1585899430000, 0.19], [1585899440000, 0.2], [1585899450000, 0.18], [1585899460000, 0.2], [1585899470000, 0.23], [1585899480000, 0.18], [1585899490000, 0.32], [1585899500000, 0.31], [1585899510000, 0.42], [1585899520000, 0.22], [1585899530000, 0.44], [1585899540000, 0.33], [1585899550000, 0.3], [1585899560000, 0.35], [1585899570000, 0.23], [1585899580000, 0.33], [1585899590000, 0.32], [1585899600000, 0.45], [1585899610000, 0.31], [1585899620000, 0.33], [1585899630000, 1.08], [1585899640000, 0.31], [1585899650000, 0.38], [1585899660000, 0.44], [1585899670000, 0.5], [1585899680000, 0.45], [1585899690000, 0.35], [1585899700000, 0.58], [1585899710000, 0.57], [1585899720000, 0.58], [1585899730000, 0.52], [1585899740000, 1.66], [1585899750000, 0.18], [1585899760000, 0.2], [1585899770000, 0.16], [1585899780000, 0.22], [1585899790000, 0.2]]}]

时间以毫秒为单位

并且我的输出仅显示一个标签,但有时它显示足够的标签。我无法添加jsfidle,因为它在那里工作良好。我的应用程序出现问题。

enter image description here

highcharts
1个回答
0
投票
我已经尝试重现您的问题,但是使用您提供的数据可以正常工作。

演示:https://jsfiddle.net/BlackLabel/1j37eL0u/

xAxis: { type: 'datetime' },

我(从您的屏幕上假设,仅当图表宽度较小时,问题才存在。我建议使用响应规则将

xAxis.tickAmount设置为一定数量。

API:https://api.highcharts.com/highcharts/xAxis.tickAmount

API:https://api.highcharts.com/highcharts/responsive

或者您可以尝试使用

tickPositioner

回调来匹配刻度线。 API:https://api.highcharts.com/highcharts/xAxis.tickPositioner

如果上述建议无济于事,请尝试使用我可以处理的一些在线编辑器重现您的案件。我想到的一件事-也许您使用的是与当前版本不同的Highcharts版本?

© www.soinside.com 2019 - 2024. All rights reserved.