带有高图表的 xaxis 上的日期
Dates on xaxis with highcharts
我需要在图表上的轴上显示日期。我通过范围日期选择器收集数据,用户可以在其中输入 14 天的范围。我需要轴上的第一个值是范围的开始日期,最后一个值是范围的结束日期。我希望 xaxis 标签读作"2015 年 1 月 27 日"、"2015 年 1 月 28 日"或该方向的内容,每个抽动为 1 天。我已经阅读了 API 文档,并且我对图表的设置进行了大量尝试,但由于某种原因我无法让它工作。
$('#graphColumn').highcharts({
title: {
text: '',
x: -20 //center
},
xAxis: {
categories: [dayArray[0], dayArray[1], dayArray[2], dayArray[3], dayArray[4], dayArray[5], dayArray[6], dayArray[7], dayArray[8], dayArray[9], dayArray[10], dayArray[11], dayArray[12], dayArray[13]]
},
yAxis: {
title: {
text: ''
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: ''
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
credits: {
enabled: false
},
series: [{
showInLegend: false,
name: ' ',
data: series,
color: '#77B7C5',
marker: {
symbol: 'circle'
}
}, {
showInLegend: false,
name: '1 år sedan',
data: series1yearago,
color: "#71C73E",
marker: {
symbol: 'circle'
}
}]
});
这是我的图表。我知道xaxis现在已经设置了类别,但这只是暂时的,我知道它应该是日期时间。我的系列是常规的 int 数组,每个索引上都有一个数字。我将不胜感激在这里可以提供的任何帮助!
编辑:这是一个工作jsfiddle示例:http://jsfiddle.net/g0p00tLv/1
您的数据及其格式设置方式是我们真正需要看到的。
您需要执行以下两项操作之一:
1) 将数据作为 [x,y] 对数组传递,其中 x 是纪元时间戳(以毫秒为单位)或日期。UTC 对象
2) 将数据作为 y 值的单个数组传递,并使用 pointStart 和 pointInterval 属性正确设置日期轴。
参考:
-
http://api.highcharts.com/highcharts#plotOptions.series.pointStart
-
http://api.highcharts.com/highcharts#plotOptions.series.pointInterval
如果您需要更多信息,请设置一个有效的小提琴示例并将其发布在此处。
相关文章:
- 比较从函数和生成的日期对象
- Json数据包含日期和时间格式
- Javascript日期格式类似于ISO,但本地
- 如何在输入字段中的按钮的帮助下打开日历,该字段的类型为“=”;日期”;
- 如何在JavaScript中延长当前日期
- 两位数的月份日期验证
- 更改angularjs中的日期-时间格式
- 将日期时间作为 JSON 发送将无法在我的视图中正确显示
- 带有高图表的 xaxis 上的日期
- 高图表 xaxis 日期时间和 yaxis 数据
- 高位折线图xAxis日期时间正在向下采样
- 如何在xAxis中获取带有日期的类别
- NVD3在xAxis上使用日期类型时,折线图错误地与网格对齐
- Highcharts缺少xAxis上的第一个日期标签
- Highstock日期时间xAxis,只能显示全部.没有变焦
- Highcharts xaxis日期时间问题
- 如何添加年在xAxis日期格式,而导出?以及如何在导出过程中添加数据源
- Highcharts xAxis与日期时间不显示任何图表
- 如何在Highcharts中修复xAxis(日期时间)比例
- 更改nvd3图表中xAxis的日期格式