gpt4 book ai didi

javascript - 如何为 Xively 数据流创建 Highstock 图表?

转载 作者:行者123 更新时间:2023-11-28 02:14:21 25 4
gpt4 key购买 nike

我正在尝试根据 Xively 数据创建 Highstock 图表。

我能够创建常规 line chart通过 Xively 数据流的历史查询并进行一些基本数据格式调整,我可以将其传递给 Highcharts.Chart()

我尝试过制作 Highstock chart没有任何成功。

我刚开始使用 Highcharts,而且不熟悉 JavaScript。

最佳答案

在基本的 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循环来做到这一点,并且我还使用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
}
}]
});

关于javascript - 如何为 Xively 数据流创建 Highstock 图表?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16639412/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com