highcharts js库接受日期的格式是什么?

His*_*alv 33 javascript highcharts

我正在使用highcharts并且无法确定日期输入应该是从rails日期到日期的highcharts接受格式.

在我的迁移文件中,我存储的日期如下:

t.date :consumption_date
Run Code Online (Sandbox Code Playgroud)

该值以"2012-03-25"格式存储,然后转到终端找到记录,我得到了这个:

=>  Sat, 31 Mar 2012
Run Code Online (Sandbox Code Playgroud)

图表呈现时,各个点显示无效日期.以下数组输出到highcharts进行渲染

[[Sun, 25 Mar 2012, 1158], [Sat, 31 Mar 2012, 1200]]
Run Code Online (Sandbox Code Playgroud)

当jQuery中提交数据时,highcharts在其中一个演示图表中使用的格式如下:

[[Date.UTC(1970,  9, 27), 0   ], [Date.UTC(1970, 10, 10), 0.6 ]]
Run Code Online (Sandbox Code Playgroud)

如何通过向highcharts提交正确的日期格式来消除无效日期.

eol*_*son 41

内部Highcharts使用javascript日期编号(自1970年1月1日以来的毫秒数)来表示日期.请参阅Mozilla参考.

要在轴上获取日期,首先需要将轴类型设置为"datetime":

xAxis: {
    type: 'datetime'
}
Run Code Online (Sandbox Code Playgroud)

指定系列数据时有几个选项(所有三个示例都生成相同的图表):

  1. 设置起点并使用点之间的固定间隔

    pointStart: Date.UTC(2012, 2, 6, 10),
    pointInterval: 1000 * 60 * 60,
    data: [5, 6, 4]
    
    Run Code Online (Sandbox Code Playgroud)
  2. 使用Date.UTC方法指定确切的日期.这种方式对人类可读:

    data: [
        [Date.UTC(2012, 2, 6, 10), 5], 
        [Date.UTC(2012, 2, 6, 11), 6], 
        [Date.UTC(2012, 2, 6, 12), 4]]
    
    Run Code Online (Sandbox Code Playgroud)
  3. 或直接指定纪元时间:

    [[1331028000000, 5], [1331031600000, 6], [1331035200000, 4]]
    
    Run Code Online (Sandbox Code Playgroud)

关于jsfiddle的例子