Convert JSON to Array in Javascript

Navigation
3

Good afternoon, it's my first question here.

I'm getting the json below through an ajax request. 

[
    {"SEMANA":1.0,"PRODUCAO":0.0,"PRODUCAO2":0.0},
    {"SEMANA":2.0,"PRODUCAO":29280.0,"PRODUCAO2":55992.0},
    {"SEMANA":3.0,"PRODUCAO":93864.0,"PRODUCAO2":75072.0},    
    {"SEMANA":4.0,"PRODUCAO":135625.0,"PRODUCAO2":102480.0}
]

I convert JSON to array as follows: 

$.get("caminho do WebService", function (dados) {
    var arrSemana = [],
    arrProd1 = [],
    arrProd2 = [];
    for (var i = 0; i < dados.length; i++) {
        arrSemana.push(dados[i].SEMANA);
        arrProd1.push(dados[i].PRODUCAO);
        arrProd2.push(dados[i].PRODUCAO2);
    }
    //......
});

But at the time I'm going to check out this my array (arrSemana, arrProd1, arrProd2) is thus [,,,,,,,,] and not with values as I would like [1.0, 2.0, 3.0]

I'm creating graphics with highChart so I need this array.

Where am I wrong that he is not picking up the values as I need them? Does anyone have an example that can help me?

Thank you for your attention.

I'm working with Apache Cordova (PhoneGap). I need to put this in 3 array so I can put it on the chart.

$ (function () {$ .get ("WebService path", function) {

var arrSemana = [],
    arrProd1 = [],
    arrProd2 = [];

for (var i = 0; i < dados.length; i++) {
    arrSemana.push(dados[i].SEMANA);
    arrProd1.push(dados[i].PRODUCAO);
    arrProd2.push(dados[i].PRODUCAO2);
}
// Os alerts estão aqui para teste...
alert(dados);
alert(arrSemana);
alert(arrProd1);
alert(arrProd2);

$('#chart').highcharts({
    title: {
        text: 'Produção semanal de açúcar (registrada)',
        x: -20 //center
    },
    subtitle: {
        text: 'Dados: Teste de Relatório',
        x: -20
    },
    xAxis: {
        title: {
            text: 'Semanas'
        },
        categories: arrSemana, //Um array vem aqui...
        minTickInterval: 5,
        minRange: 0,
        min: 0
    },
    yAxis: {
        allowDecimals: false,
        title: {
            text: 'Produção'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        valueSuffix: 'un'
    },
    legend: {
        layout: 'vertical',
        align: 'middle',
        verticalAlign: 'bottom',
        borderWidth: 0
    },
    series: [{
        name: 'Semanas 12/13',
        color: '#32CD32',
        data: arrProd1 // Outro array vem aqui...
    }, {
        name: 'Semanas 13/14',
        color: '#000000',
        data: arrProd2 // Outro array vem aqui...
    }]
});

)) fail (function () {     alert ("Error loading report data."); }); });

    
asked by anonymous 03.12.2014 / 20:36

1 answer

3

I suggest using .map() to do this. 

var json = JSON.parse('[ {"SEMANA":1.0,"PRODUCAO":0.0,"PRODUCAO2":0.0}, {"SEMANA":2.0,"PRODUCAO":29280.0,"PRODUCAO2":55992.0}, {"SEMANA":3.0,"PRODUCAO":93864.0,"PRODUCAO2":75072.0}, {"SEMANA":4.0,"PRODUCAO":135625.0,"PRODUCAO2":102480.0} ]');

var arrays = ['SEMANA','PRODUCAO','PRODUCAO2'];
arrays = arrays.map(function(campo){
    var novoConteudo = json.map(function(objeto){
       return objeto[campo]; 
    });
    return novoConteudo;
});

alert(JSON.stringify(arrays));

The .map() part of an array and returns a array with the same number of elements but with new content. So starting with ['SEMANA','PRODUCAO','PRODUCAO2'] I made a first map() that iterates each field, inside from the first map I create another map, which iterates the JSON. So for each array of JSON I'm going to get only the "field" that interests me.

Note that in your JSON some fields come for example 1.0 in numerical. If you do not have this in String then it will be read as only 1 .

If you want to have a variable for each array you can do: 

var arrSemana = arrays[0];
var arrProd1 = arrays[1];
var arrProd2 = arrays[2];
    
03.12.2014 / 22:54
Laravel BelongsToMany What's the difference of loading javascript into script or external file?