javascript HighCharts - 时间序列图表 - xAxis 上的不规则日期时间间隔
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22107599/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HighCharts - timeseries chart - irregular datetime interval on xAxis
提问by Luke
I need to make a chart on which xAxis is of type 'datetime', but have irregular intervals:
我需要制作一个图表，其中 xAxis 的类型为“日期时间”，但间隔不规则：
this is the code:
这是代码：
$(function () {
$('#chart1').highcharts({
chart: {
zoomType: 'x',
spacingRight: 20
},
title: {
text: 'Incomes/Outcomes'
},
subtitle: {
text: document.ontouchstart === undefined ?
'Click and drag in the plot area to zoom in' :
'Pinch the chart to zoom in'
},
xAxis: {
type: 'datetime',
minRange: 15 * 24 * 3600000,
title: {
text: null
}
},
yAxis: {
title: {
text: 'Euro()'
}
},
tooltip: {
shared: true
},
legend: {
enabled: true
},
plotOptions: {
area: {
fillColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
stops: [
[0, Highcharts.getOptions().colors[9]],
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
]
},
//lineWidth: 1,
marker: {
enabled: false
},
shadow: false,
states: {
hover: {
lineWidth: 1
}
},
threshold: null
}
},
series: [{
type: 'area',
pointInterval: 24 * 3600 * 1000,
pointStart: Date.UTC(2014, 0, 01),
data: [["31/12/2013", 345.2], ["09/01/2014", 494.79999999999995], ["20/01/2014", 137.2], ["22/01/2014", 210.0],
["23/01/2014", 220.4], ["24/01/2014", 871.0], ["28/01/2014", 420.0], ["30/01/2014", 420.0], ["31/01/2014", 2057.15],
["05/02/2014", 191.2], ["06/02/2014", 81.6], ["07/02/2014", 295.2], ["11/02/2014", 135.12], ["12/02/2014", 189.2],
["13/02/2014", 210.0], ["14/02/2014", 315.2], ["17/02/2014", 462.79999999999995], ["18/02/2014", 544.4],
["19/02/2014", 715.4399999999999], ["20/02/2014", 971.2], ["21/02/2014", 418.0], ["02/02/2015", 366.0]]
}]
});
});
you can see that series values do not correspond to xAxis values. How can I fix it: having same days on xAxis or having months corresponding to series values days?
您可以看到系列值不对应于 xAxis 值。我该如何解决：在 xAxis 上有相同的天数，或者有与系列值天数相对应的月份？
thanks Luke
谢谢卢克
回答by Gadget27
You can remove the pointStart assignment, highcharts will determine the range based on trhe values you provide it. Highcharts will take a look at the range of data you supply it and auto generate the tick marks based on your tickInterval settings, and the available dimensions of your chart. If you need the tick marks on the axis to be specifically the dates you have in you data, you should not used the datetime type axis.
您可以删除 pointStart 分配，highcharts 将根据您提供的值确定范围。Highcharts 将查看您提供的数据范围，并根据您的 tickInterval 设置和图表的可用尺寸自动生成刻度线。如果您需要轴上的刻度线专门表示您的数据中的日期，则不应使用日期时间类型轴。
Highcharts handles all date data value in unix/epoch time (number of seconds since 1/1/1970). If you want to use datetime axis, you must supply your data in that format.
Highcharts 以 unix/epoch 时间（自 1/1/1970 以来的秒数）处理所有日期数据值。如果要使用日期时间轴，则必须以该格式提供数据。
Change all your date values such as
更改所有日期值，例如
["31/12/2013", 345.2]
to
到
[Date.UTC(2013, 11, 31), 345.2]
