Data structure/format of C3 data using JavaScript

Question

I am trying to get my array of objects in the format that is needed to create a C3 bar chart but I am having trouble categorizing my data with JavaScript. Below is my JavaScript code.

data = [
  {Service:"Army",Permanent:20,Itinerant:754,Region:"Western"},
  {Service:"Air Force",Permanent:100,Itinerant:2,Region:"Eastern"},
  {Service:"Army",Permanent:10,Itinerant:7,Region:"Western"},
  {Service:"Air Force",Permanent:30,Itinerant:2,Region:"Eastern"}
]

var sumAry=[];

for (var x=0; x<data.length; x++){
   var val =sumAry.indexOf(data[x].Service);
  if(val === -1){
     var permanent += data[x].Permanent;
     sumAry.push(data[x].Service, permanent);
  }else{
    console.log("IN");
  }
}

https://codepen.io/isogunro/pen/GYRKqE?editors=0012

The C3 chart looks for a data in the structure/format shown below:

        ['Army', 30],
        ['Airorce', 130],
        ['Navy', 190],
        ['Army1', 70],
        ['Airorce2', 130],
        ['Navy3', 100]

For each of the values, the 'Permanent' property will be added up to get the number part of the array. It becomes an aggregate of all the information.

Answer 1

Assuming the number in the preferred format comes from the Permanent property, you could use Array.map to transform your dataset.

 var data = [{ Service: "Army", Permanent: 654, Itinerant: 754, Region: "Western" }, { Service: "Air Force", Permanent: 9, Itinerant: 2, Region: "Eastern" }, { Service: "Army", Permanent: 6, Itinerant: 7, Region: "Western" }, { Service: "Air Force", Permanent: 9, Itinerant: 2, Region: "Eastern" } ]; var aggregates = data.map(function (o) { // map original objects to new ones with zeroed-out data return { Service: o.Service, Permanent: 0, } }).filter(function (o, index, a) { // filter the list to have only unique `Service` properties var service = o.Service; var i; for (i = 0; i < a.length; i += 1) { if (a[i].Service === service) { // break out of the loop when the first matching `Service` is found. break; } } // `i` is now the index of the first matching `Service`. // if it's the first occurrence of that `Service`, keep it, otherwise ditch it. return i === index; }); data.forEach(function (o) { // loop through the aggregate list and get the matching `Service` property. var agg = aggregates.filter(function (p) { return o.Service === p.Service; })[0]; // first element is the match. // sum the `Permanent` properties. agg.Permanent += o.Permanent; }); // now that the data has been aggregated, transform it into the needed structure. var c3data = aggregates.map(function (d) { return [d.Service, d.Permanent]; }); console.log(JSON.stringify(c3data));