我正在尝试从Xively数据创建一个Highstock图表。
我能够从Xively数据流的历史查询中创建常规line chart,并且通过一些基本的数据格式调整,我可以将其传递给Highcharts.Chart()
。
我尝试过Highstock chart但没有成功。
我是使用Highcharts的新手,我不熟悉JavaScript。
答案 0 :(得分:1)
在基本的Highcharts示例中,您有一些适应数据格式的代码。该代码使用value
/ at
键获取数据点对象数组并制作二维数组。
它映射了这个:
[
{ value: "59", at: "2013-05-01T00:59:45.645022Z" },
{ value: "59", at: "2013-05-01T01:59:48.550144Z" },
{ value: "59", at: "2013-05-01T02:59:51.313604Z" }
]
到此:
[
["2013-05-01T00:59:45.645022Z", 59],
["2013-05-01T01:59:48.550144Z", 59],
["2013-05-01T02:59:51.313604Z", 59]
]
我可以使用简单的 for-loop 执行此操作,并且还使用Date.parse()
和parseFloat()
来确保Highcharts正确理解我的数据:
var xively_datapoints = data.datapoints;
var chartdata = [];
for (i = 0; i < xively_datapoints.length; i++) {
chartdata.push([
Date.parse(xively_datapoints[i].at),
parseFloat(xively_datapoints[i].value)
]);
}
然后我将chartdata
数组传递给Highcharts,如下所示:
$('#container').highcharts('StockChart', {
rangeSelector : {
selected : 1
},
series : [{
name : 'Highstock+Xively',
data : chartdata, // reformatted data
tooltip: {
valueDecimals: 2
}
}]
});