Question

我有这样的Json数据：

q_table.php

[{“data”：[“2012-12-16; 0”，“2012-12-16; 23”]}，{“name”：“MSMDN1”，“data”：[98.9914,99.5429] }，{ “名称”： “MSMDN2”， “数据”：[99.4577,99.5078]}，{ “名称”： “MSMDN3”， “数据”：[99.1454,99.4605]}，{ “名称”： “MSMDN4” “数据”：[98.9663,99.3663，]}，{ “名称”： “MSMDN5”， “数据”：[104.97,91.4251]}]

我想计算数组数据，所以数据看起来像这样：

json_data = [0]; //data":["2012-12-16; 0","2012-12-16; 23"]
json_data = [1]; //"name":"MSMDN1","data":[98.9914,99.5429]
json_data = [2]; //"name":"MSMDN2","data":[99.4577,99.5078]
json_data = [3]; //"name":"MSMDN3","data":[99.1454,99.4605]
json_data = [4]; //"name":"MSMDN4","data":[98.9663,99.3663,]
json_data = [5]; //"name":"MSMDN5","data":[104.97,91.4251]}

如何从javascript中计算这些数组？

以下代码已经完成，但正如您在脚本部分看到的那样获取json数据，我必须手动声明系列和类别

$(document).ready(function() {
        var options = {
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 155
            },
            title: {
                text: 'Revenue vs. Overhead',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            xAxis: {
                categories: [''],
                labels: 
                {
                    rotation: -90
                }   
            },
            yAxis: {
                title: {
                    text: 'Amount'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            series: []
        }

        $.getJSON("q_table.php", function(json) {
            options.xAxis.categories = json[0]['data'];
            options.series[0] = json[1];
            options.series[1] = json[2];
            options.series[2] = json[3];
            options.series[3] = json[4];
            options.series[4] = json[5];
            //options.series[5] = json[6];
            chart = new Highcharts.Chart(options);
        });
});

这是我根据#SebastianBochan回答

更改的脚本部分

$.getJSON("q_table.php", function(json) 
        {
            var len = json.length

            for(i=0;i<len;i++){
                if(i===0){
                    options.xAxis.categories = json[i]['data'];
                }else{
                    j = i-1;
                    options.series[j] = json[i];
                }
            }


            chart = new Highcharts.Chart(options);
        });

或任何其他方式，非常高兴..

工作脚本

$(document).ready(function() {
        var options = {
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 155
            },
            title: {
                text: 'Revenue vs. Overhead',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            xAxis: {
                categories: [''],
                labels: 
                {
                    rotation: -90
                }   
            },
            yAxis: {
                title: {
                    text: 'Amount'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            series: []
        }


        $.getJSON("q_table.php", function(json) 
        {
            var len = json.length

            for(i=0;i<len;i++){
                if(i===0){
                    options.xAxis.categories = json[i]['data'];
                }else{
                    j = i-1;
                    options.series[j] = json[i];
                }
            }


            chart = new Highcharts.Chart(options);
        });

    });

Answer 1

$.getJSON("q_table.php", function(json)
    var options = {};   // whatever options you want to set, at least the container
    options.series = new Array();
    for(i=0;i< json.length;i++) {
        options.series.push(json[i]);
    }
    chart = new Highcharts.Chart(options);
});

Answer 2

您需要解析检查哪个行应该是类别以及哪个系列。我将json模拟为变量Take look：

var json = [{
    "data": ["2012-12-16; 0", "2012-12-16; 23"]
}, {
    "name": "MSMDN1",
    "data": [98.9914, 99.5429]
}, {
    "name": "MSMDN2",
    "data": [99.4577, 99.5078]
}, {
    "name": "MSMDN3",
    "data": [99.1454, 99.4605]
}, {
    "name": "MSMDN4",
    "data": [98.9663, 99.3663]
}, {
    "name": "MSMDN5",
    "data": [104.97, 91.4251]
}];


var len = json.length
i = 0;

var options = {
    xAxis: {
        categories: []
    },
    series: []
}

for (i; i < len; i++) {
    if (i === 0) {
        var dat = json[i].data,
            lenJ = dat.length,
            j = 0,
            tmp;

        for (j; j < lenJ; j++) {
            tmp = dat[j].split(';');
            options.xAxis.categories.push(tmp[0]);
        }
    } else {
        options.series.push(json[i]);
    }
}

http://jsfiddle.net/UKfPm/

计算json数据以在高亮度折线图中创建动态系列

2 个答案: