几个系列在HighChart中具有相同的xAxis数据

时间:2013-02-25 11:51:39

标签: datetime highcharts time-series

我正在使用Highchart在两个yAx和一个日期时间xAxis上绘制多个系列(大约20个)。数据通过提供JSON答案的PHP脚本动态加载。到目前为止,非常好。

我的问题是,为了符合Highchart,我必须通过网络发送每个系列的日期时间信息(当然,我只能在收到日期时间信息后改变JS中的JSON数据,但这也是一个麻烦)。 500个数据点乘以20个系列乘以13个字节用于时间戳=每次刷新130KB的流量,当其中1/20就足够了。

我的问题是:是否有可能将“系列”(日期时间)信息传递给xAxis,然后按照出现顺序将yAxes系列分配给xAxis值?即我通过了:

[1361796390000,1361796400000,1361796410000]到xAxis,和 [1,2,3]到yAxis

和Highchart分配1到1361796390000,2到1361796400000等等?

感谢您的回答。

1 个答案:

答案 0 :(得分:1)

您实际上不需要为系列中的每个数据点传递日期时间。您只需要传递系列的开始日期时间,然后使用pointStart让图表知道何时开始计数,如下所示:

series: [{
    name: 'Wind Speed',
    data: [0.52, 0.778, 0.746, 0.594, 0.716, 0.793, 0.648, 0.828, 0.202, 0.066, 0.116, 0.116, 0.17, 0.195, 0.051, 0, 0.368, 2.365, 2.841, 2.693, 2.416, 2.541, 2.429, 2.888],
    pointStart: 1360893600000,
    pointInterval: 3600000
}]

请参阅:http://jsfiddle.net/Reality_Extractor/pNFYL/

pointStart期待Unix time虽然有很多不同的方法可以让你轻松地想出你需要的特定时间。我只是为了演示目的在示例中对其进行了硬编码。

使用pointStart时,必须使用pointInterval来准确地为数据点分配时间。值得注意的是,这仅适用于具有常规pointIntervals的数据。如果您有不规则数据,则需要为每个数据点提供日期时间。

这并没有完全回答你关于将时间作为数组传递然后将其分配给xAxis的问题,但我确实认为pointStart方法不如数组赋值复杂。

此外,根据您应该在服务器和客户端缓存数据的频率,有些相关,以防止在数据实际没有更改的情况下通过网络进行不必要的刷新。

相关问题