从Google Visualization Datatable到Highcharts数据格式

时间:2012-04-24 09:26:54

标签: json graph highcharts

我有一个程序可以从Como数据库中获取传感器数据,并将html页面放入图形中。现在图表是使用Google Graph API实现的,但我必须切换到Highcharts。

我有一个以Google格式转换json数据的函数

    function json2gdt(data) {
    // Build a google.DataTable
    var gdt = new google.visualization.DataTable();
    gdt.addColumn('datetime', 'Time');
    gdt.addColumn('number', 'value');
    gdt.addRows(data.length*2);
    var prev = data[0][1];
    for (var i=0; i<data.length; i++) {
    ts = data[i][0] * 1000
        gdt.setValue(i*2, 0, new Date(ts));
    gdt.setValue(i*2, 1, prev); 
        gdt.setValue(i*2+1, 0, new Date(ts));
        gdt.setValue(i*2+1, 1, data[i][1]);
    prev = data[i][1];
    }
    return gdt;
}

然后我有一个在html页面中可视化图形的函数:

function visualize(json_response) {
var err = json_response['error'];
if (err) {
  $("#chart_div").html("<div class='alert'>" + err + "</div>");
  return;
}
var data = json_response['data'];
if (data.length == 0) {
  $("#chart_div").html("<div class='info'>No data received from this sensor!</div>");
  return;
}
// Convert Data to a step function
//var step_data = json2step(data);
var gdt = json2gdt(data);
var start;
if (data && data.length != 0) 
// TODO: fix this to actually compute the half of the time period
start = new Date(data[Math.floor(data.length / 2)][0] * 1000);
// draw our data in the widget
if (chart == null) {
    chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div'));
}
// TODO: compute tickness as a function of the time interval
chart.draw(gdt, {displayAnnotations: false, 
        displayZoomButtons: true, 
        thickness: 2,
        fill: 10,
                {% if net.ntype == "ztc" and sens.type == 2 %}
                  colors: ['#F00000'],
          scaleType: 'fixed', 
          min: 0,
          max: 1,
        {% else %}
                  scaleType: 'maximized', 
                {% end %}
        allowRedraw: true,
        displayExactValues: true,
        zoomStartTime: start});

}

最后这是一些json数据文件..

#master: sender-64bit-addr receiver-timestamp *;OPCODE;sender-timestamp;sender-seq-num;payload-length;payload#
#master: input file (re)opened at 4f708e9d
#master: child [pid=6884]  started  at 4f708eb1
0000000000000000 4f708eb2 *ZTCR;00000004;00000002;16;9755080000010000000000#
0000000000000000 4f708eb2 *ZTCR;00000004;00000003;10;9634050010000003#
0000000000000000 4f708eb2 *ZTCR;00000005;00000004;0A;97410200EA#
0000000000000000 4f708eb3 *ZTCR;00000005;00000005;10;9634050010000003#

任何人都可以帮助我吗?我必须更改highcharts的数据格式,或者谷歌图表是否相同?

1 个答案:

答案 0 :(得分:0)

json对象是这样的:

"{ 
'data' : [
              [1, 10], 
              [2, 11], 
              [3, 12]
 ]
 }"