我有每日图表,横跨00:00到23:59。但是对于实时数据,假设当前是9AM,默认情况下它将从00:00到09:00拉伸图形,这对我来说不太好看。我想要的是同一天23:59的x轴最大值,因此它将显示为09:00 - 23:59为空白。我试过$graph["xAxis"]["max"] = (time()+86400)*1000
但没有用。有什么建议吗?谢谢!
答案 0 :(得分:11)
(虽然这是一个老问题,我来到这里使用谷歌搜索,当搜索高图中x轴的最大时间时,它仍然是搜索结果的顶部,所以我认为这个评论仍然有用。)
对于旧版本的highcharts,接受的答案可能是正确的,但在当前版本(v3.0.7)中,您还可以将xAxis.max属性设置为您希望图表结束的日期时间。这看起来像这样,IMO是一种更清洁的解决方案:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
xAxis: {
type: 'datetime',
max: Date.UTC(2010, 0, 2),
dateTimeLabelFormats: {
day: '%e of %b'
}
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6],
pointStart: Date.UTC(2010, 0, 1),
pointInterval: 1 * 3600 * 1000 // one hour
}]
});
});
答案 1 :(得分:7)
Highcharts只显示指定的最后一个数据点。如果要强制它显示0900 - 23:59,则必须将所有数据点传递给您想要显示的那些时间,但是值为null null 。以下是一个示例:jsfiddle example。
一旦数据点超过小时范围,它将自动格式化数据时间标签。您可能希望通过dateTimeLabelFormats控制数据标签的格式。
答案 2 :(得分:1)
如前一个答案所述,默认情况下,
Highcharts只会显示指定的最后一个数据点。
但是,正如您在default jsfiddle for min max setting上看到的那样,除了min和max之外,还必须指定endOnTick和startOnTick都为false。此外,在处理日期时间类型的缺失数据时,您需要将序数设置为false,以便为空数据留出空间。
这意味着您的xAxis应如下所示:
xAxis : {
allowDecimals : false,
endOnTick : false,
max : /** Date in timestamp for the end the day */,
min : /** Date in timestamp for the beginning the day */,
ordinal : false,
startOnTick : false,
type : 'datetime'
},