CODEWITHSUNDEEP
javascriptjqueryarraysparsing
Jane Wilkie
Jane Wilkie

Reputation: 1743

Parsing JSON from array of arrays in Javascript

I have the following code that worked (past tense) great!

$(function() {
  var data = [{
    "day": "06/19/2016",
    "region": "Ohio",
    "metric": "98.61"
  }, {
    "day": "06/19/2016",
    "region": "Western NE",
    "metric": "98.63"
  }, {
    "day": "07/19/2016",
    "region": "Ohio",
    "metric": "68.61"
  }, {
    "day": "07/19/2016",
    "region": "Western NE",
    "metric": "32.63"
  }, {
    "day": "08/19/2016",
    "region": "Ohio",
    "metric": "98.61"
  }, {
    "day": "08/19/2016",
    "region": "Western NE",
    "metric": "48.63"
  }]

  var exist, index, options = {
    xAxis: {
      categories: []
    },
    series: []
  }
  Highcharts.each(data, function(p, i) {
    exist = false;
    if (options.xAxis.categories.indexOf(p.day) < 0) {
      options.xAxis.categories.push(p.day)
    }
    Highcharts.each(options.series, function(s, j) {
      if (s.name === p.region) {
        exist = true;
        index = j;
      }
    });
    if (exist) {
      options.series[index].data.push(parseFloat(p.metric))
    } else {
      options.series.push({
        name: p.region,
        data: [parseFloat(p.metric)]
      })
    }
  })
  $('#container').highcharts(options);
});

I have a fiddle for it here.... https://jsfiddle.net/wilkiejane/sr5dpaft/

Unfortunately vendor changed the format of the JSON and everything is broken and I'm not sure how to parse it.

It changed from [{},{},{}] to [[{}],[{}],[{}]]. Looks like several arrays now instead just one.

So now my data looks like this...

  var data = [[{
    "day": "06/19/2016",
    "region": "Ohio",
    "daily_er": "98.61"
  }],[{
    "day": "06/19/2016",
    "region": "Western NE",
    "daily_er": "98.63"
  }],[{
    "day": "07/19/2016",
    "region": "Ohio",
    "daily_er": "68.61"
  }],[{
    "day": "07/19/2016",
    "region": "Western NE",
    "daily_er": "32.63"
  }],[{
    "day": "08/19/2016",
    "region": "Ohio",
    "daily_er": "98.61"
  }],[{
    "day": "08/19/2016",
    "region": "Western NE",
    "daily_er": "48.63"
  }]
]

Does anyone know how I would iterate over this change? I'll keep banging away but so far I have spent a few hours on it with not much to show for it.

Upvotes: 0

Views: 75

Answers (2)

gaetanoM
gaetanoM

Reputation: 42044

If you need the old format you may always convert the new format to the old one using Array.map().

var data = [[{
  "day": "06/19/2016",
  "region": "Ohio",
  "daily_er": "98.61"
}],[{
  "day": "06/19/2016",
  "region": "Western NE",
  "daily_er": "98.63"
}],[{
  "day": "07/19/2016",
  "region": "Ohio",
  "daily_er": "68.61"
}],[{
  "day": "07/19/2016",
  "region": "Western NE",
  "daily_er": "32.63"
}],[{
  "day": "08/19/2016",
  "region": "Ohio",
  "daily_er": "98.61"
}],[{
  "day": "08/19/2016",
  "region": "Western NE",
  "daily_er": "48.63"
}]
];

//
// Convert new format to old format
//
data = data.map(function(ele, index) {
  return ele[0];
});

console.log(data);

Upvotes: 2

AryKay
AryKay

Reputation: 308

You can access the first element of each array by using p[0], where the array is p. Of course, if you use that on your code you'd be assuming that each array does contain one element and you'd only be accessing the first element of each array.

A way to make it more "universal" and future-proof is to run a loop for each array. Check the working fiddle below: https://jsfiddle.net/sr5dpaft/9/

I run a for loop through every element on each p array and do the logic for each existing element.

Upvotes: 0

Related Questions