Turn jQuery array of objects into a new array

Question

Currently my Rails controller is returning an array of objects:

var _data = [];

$.getJSON(my_url, function(data) {
  $.map(data, function(v) {
     _data.push([v.occurrences, v.period])
   });
});

console.log(_data) => []

Which when expanded looks like this:

Array[4]
 0:Object
 1:Object
 2:Object
 3:Object

And individual objects when expanded look like this:

0:Object
 occurrences:1
 period:1488499200000

I'm having trouble mapping the initial array of objects in such a way that my final result will be an array of arrays that is comprised of each objects' occurrences value and period value.

The end result should like like:

[[1488499200000, 1],[.., ..],[.., ..],[.., ..]]

So that I can use each array in a chart as an x and y axis point.

I've tried using .map, .each, (for i in ..), etc. with no luck.

EDIT:

This is my chart data:

var line_data2 = {
  data: _data,
  color: "#00c0ef"
};

$.plot("#myGraph", [line_data2], {
  grid: {
    hoverable: true,
    borderColor: "#f3f3f3",
    borderWidth: 1,
    tickColor: "#f3f3f3"
  },
  series: {
    shadowSize: 0,
    lines: {
      show: true
    },
    points: {
      show: true
    }
  },
  lines: {
    fill: false,
    color: ["#3c8dbc", "#f56954"]
  },
  yaxis: {
    show: true,
  },
  xaxis: {
    show: true,
    mode: "time",
    timeformat: "%m/%d/%Y"
  }
});

Possible duplicate of [How do I return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Dhiraj, Mar 09 '17 at 03:23
your code is right, I have try on [jsfiddle](https://jsfiddle.net/84p5kevk/), can I see where `_data` use on chart function ? — rails_id, Mar 09 '17 at 03:29
@rails_id oh that's strange, ok I'll post my chart (flot charts) code in the edit above — asalgan, Mar 09 '17 at 03:30
@asalgan I have test again on [jsfiddle](https://jsfiddle.net/xzo06znt/1/), your code is fine I think, can you try debug a `_data` when assign to chart function? — rails_id, Mar 09 '17 at 04:00
Alright I found the issue, it was with how I was initially pulling in the data, I had to change my .getJSON to an .ajax() request set inside a function and return the result from there. — asalgan, Mar 09 '17 at 04:28

score 0 · Answer 1 · answered Mar 09 '17 at 03:52

0

There is likely a more elegant solution than this, but this will get you the shaped array I think you are asking for.

let _data = [
  {occurrences: 1, period: 200},
  {occurrences: 3, period: 300},
  {occurrences: 6, period: 400}
];

let newData = _data.map((x)=>{
  let arr = [];
  arr.push(x.occurrences);
  arr.push(x.period);
  return arr;
});

console.log(newData);

You could take it a step further and simply loop through the object rather than hard coding the names.

let newData = _data.map((x)=>{
  let arr = [];
  for(let i in x){
    arr.push(x[i]);
  }
  return arr;
});

answered Mar 09 '17 at 03:52

Michael White

1
1

So when I implement the first solution I get: [Array[2], Array[2], Array[2]] Which looks accurate but for some reason when I do the $.getJSON and console.log it I get: [] which expands into 4 objects Does this sound like an issue then with how I'm putting in the initial data? – asalgan Mar 09 '17 at 03:56
That might be the issue. I marked my own answer to delete because I couldn't test in rails. The jQuery getJson should be parsing it to an object for you and that is why I answered with just an object literal. Not sure why the map wouldn't work on an array of objects. – Michael White Mar 09 '17 at 04:50

Turn jQuery array of objects into a new array

1 Answers1