如何将json解析成highcharts [英] how to parse json into highcharts

问题描述

以下内容：

  $。get（'/ api / ajax_prices /'+ product +'/'，afterEndexPricesLoaded） 
  

返回一个json对象

  {aaData：[
 [1，70.1700，2008-12-29 11:23:00]，
 [2，70.2600， 2008-12-29 16:22:00]，
 [3，70.6500，2008-12-30 11:30:00]，
 [4，70.8700， 2008-12-30 16:10:00]，
 [5，70.5500，2009-01-02 11:09:00]，
 [6，70.6400， 2009-01-02 16:15:00] 
]} 
  

我正在尝试将json字符串解析为highchart

这是我正在使用的代码（data =上面的json字符串）：

 函数afterPricesLoaded（data，textStatus，xhr）{
 
 var options = {
图表：{
 renderTo：'graph '
}，
 title：{
 text：'Some text'，
 style：{
 color：'＃888888' 
} 
}，
 xAxis：{
类型：'datetime'
} 
 / * 
系列：[{
 
 data：[
 [Date.UTC（2011,0,0），29.9]，
 [Date.UTC（2012,0,0），71.5]，
 [ Date.UTC（2013，0，0），106.4] 
]} 
] * / 
}; 
 
 New Highcharts.Chart（options）
} 
  

我可以将数据导入highchart系列吗？

编辑

Graphtype = http://www.highcharts.com/demo/line-basic

示例 = http://jsfiddle.net/ kevink / 9q4AT /

解决方案

这就是你要找的东西？

http://jsfiddle.net/TWF6N/349/

  $（function（）{
 
 data = {aaData：[
 [1， 70.1700，2008-12-29 11:23:00]，
 [2，70.2600，2008-12-29 16:22:00]，
 [3， 70.6500，2008-12-30 11:30:00]，
 [4，70.8700，2008-12-30 16:10:00]，
 [5， 70.5500，2009-01-02 11:09:00]，
 [6，70.6400，2009-01-02 16:15:00] 
]}; 
 
 newData = data.aaData.map（function（row）{
 return [new Date（row [2]）。getTime（），parseInt（row [1]）]; 
}）; 
 console.log（newData）; 
 
 var chart = new Highcharts.Chart（{
图表：{
 renderTo：'container'
}，
 xAxis：{
键入：'datetime'
}，
 series：[{
 data：newData 
}] 
}）; 
}）; 
  

The following:

$.get('/api/ajax_prices/' + product +'/', afterEndexPricesLoaded)

Returns a json object

{"aaData": [
    [1, "70.1700", "2008-12-29 11:23:00"],
    [2, "70.2600", "2008-12-29 16:22:00"],
    [3, "70.6500", "2008-12-30 11:30:00"],
    [4, "70.8700", "2008-12-30 16:10:00"],
    [5, "70.5500", "2009-01-02 11:09:00"],
    [6, "70.6400", "2009-01-02 16:15:00"]
]}

I am trying to parse the json string into highchart

This is the code I am trying it with (data = above json string):

function afterPricesLoaded(data, textStatus, xhr) {

    var options = {
        chart: {
            renderTo: 'graph'
        },
        title: {
            text: 'Some text',
            style: {
                color: '#888888'
            }
        },
        xAxis: {
            type: 'datetime'
        }
        /*
        series: [{

            data: [
                [Date.UTC(2011, 0, 0), 29.9],
                [Date.UTC(2012, 0, 0), 71.5],
                [Date.UTC(2013, 0, 0), 106.4]
            ]}
        ]*/
    };

    new Highcharts.Chart(options)
}

How can I get the data into highchart series?

Edit

Graphtype = http://www.highcharts.com/demo/line-basic
Example = http://jsfiddle.net/kevink/9q4AT/

解决方案

Is this what you're looking for?

http://jsfiddle.net/TWF6N/349/

$(function () {

    data = {"aaData": [
        [1, "70.1700", "2008-12-29 11:23:00"],
        [2, "70.2600", "2008-12-29 16:22:00"],
        [3, "70.6500", "2008-12-30 11:30:00"],
        [4, "70.8700", "2008-12-30 16:10:00"],
        [5, "70.5500", "2009-01-02 11:09:00"],
        [6, "70.6400", "2009-01-02 16:15:00"]
    ]};

    newData = data.aaData.map( function(row) {
        return [ new Date(row[2]).getTime(), parseInt(row[1]) ];
    });
    console.log(newData);

    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container'
        },
        xAxis: {
            type: 'datetime'
        },
        series: [{
            data: newData
        }]
    });
});

这篇关于如何将json解析成highcharts的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！