How to extract two columns from an array

Question

I'm trying to extract a two dimensional array. The nodes object looks like this

I tried to get it with this, but it didn't work.

      var array_nodes = nodes.forEach(function(d) {
        return {
          x: d.x,
          y: d.y
        }
      })

I also tried a map function.

  const mappy = nodes.map(d => {d.x, d.y})

I'd like to get output that is an array with two columns, the x and y value for each of the nodes.

0: Object { id: "node1", x: 329, y: 20.71054741336845, … }
1: Object { id: "node2", x: 457, y: 20.500184787737467, … }
2: Object { id: "node3", x: 456, y: 20.046762733706277, … }
3: Object { id: "node4", x: 223, y: 20.233158455720663, … }
4: Object { id: "node5", x: 600, y: 20.73422744297443, … }
5: Object { id: "node6", x: 216, y: 20.149308369154657, … }
6: Object { id: "node7", x: 16, y: 20.923145168399262, … }
7: Object { id: "node8", x: 79, y: 20.169662471673142, … }
8: Object { id: "node9", x: 134, y: 20.453715006408252, … }
9: Object { id: "node10", x: 283, y: 20.29360719627542, … }
10: Object { id: "node11", x: 303, y: 20.551183989352833, … }
11: Object { id: "node12", x: 181, y: 20.064410948103237, … }
12: Object { id: "node13", x: 5, y: 20.959524666896623, … }
13: Object { id: "node14", x: 31, y: 20.717166269835687, … }
14: Object { id: "node15", x: 355, y: 20.355608232712868, … }
15: Object { id: "node16", x: 347, y: 20.066870342302153, … }
16: Object { id: "node17", x: 268, y: 20.2596178070026, … }
17: Object { id: "node18", x: 551, y: 20.47176940601551, … }
18: Object { id: "node19", x: 332, y: 20.714532083737808, … }
19: Object { id: "node20", x: 378, y: 20.349455393068677, … }
20: Object { id: "node21", x: 389, y: 20.171878106179093, … }
21: Object { id: "node22", x: 297, y: 20.051874061965517, … }
22: Object { id: "node23", x: 621, y: 20.216442671836216, … }
23: Object { id: "node24", x: 303, y: 20.74488014708312, … }
24: Object { id: "node25", x: 391, y: 20.181878674813944, … }
25: Object { id: "node26", x: 587, y: 20.67429664437234, … }
26: Object { id: "node27", x: 148, y: 20.432642002410144, … }
27: Object { id: "node28", x: 288, y: 20.3834012779357, … }
28: Object { id: "node29", x: 529, y: 20.82920251612347, … }
29: Object { id: "node30", x: 408, y: 20.672034499272367, … }
30: Object { id: "node31", x: 647, y: 20.850401225681374, … }
31: Object { id: "node32", x: 9, y: 20.435299150057993, … }
32: Object { id: "node33", x: 575, y: 20.646578126575864, … }
33: Object { id: "node34", x: 112, y: 20.18210449698722, … }
34: Object { id: "node35", x: 117, y: 20.969084330614713, … }
35: Object { id: "node36", x: 220, y: 20.05520101130187, … }
36: Object { id: "node37", x: 118, y: 20.682034426408872, … }
37: Object { id: "node38", x: 224, y: 20.511227921536882, … }
38: Object { id: "node39", x: 18, y: 20.115342359997282, … }
39: Object { id: "node40", x: 299, y: 20.355577802084625, … }

Dacre Denny · Answer 1 · 2019-05-07T00:58:14.997

If I understand correctly, you want to create an array of nested arrays (ie a 2D array) from the input nodes data. This can be achieved via the following:

/* Mock nodes data with the relevant x and y properties per item */
const nodes = [{
    id: 1,
    x: 0.4,
    y: 0.72
  },
  {
    id: 2,
    x: 0.5,
    y: 0.42
  },
  {
    id: 3,
    x: 0.13,
    y: 0.12
  },
  {
    id: 4,
    x: 0.33,
    y: 0.9
  }
];

/* Map each item of nodes to a nested array where each is a row of two columns */
const twoDimensionalArray = nodes.map((node) => [node.x, node.y]);

console.log(twoDimensionalArray)

The difference between this answer, and your use of the map() function is that here, the map callback returns data in [] brackets rather than in {} braces.

Using the [] brackets causes the return type of the map callback to be an array, where as the {} braces causes the return type of the map callback to be an object. By returning data using the [] brackets, we obtain the required 2D array (ie an array of nested arrays).

That is exactly what I was looking to do. Just to confirm, the different between `[]` and `{}` is that the first produces an array and the second produces a dict? — goollan, May 07 '19 at 00:44
@goollan Read more about this here: Object and arrays - https://stackoverflow.com/questions/874205/why-can-i-add-named-properties-to-an-array-as-if-it-were-an-object — Manish Gupta, May 07 '19 at 00:47

Arpit Bansal · Answer 2 · 2019-05-07T00:51:53.723

The problem with your code (below) is that you're returning on every iteration.

 var array_nodes = nodes.forEach(function(d) {
        return {
          x: d.x,
          y: d.y
        }
      })

Try:

const nodes = [{
    id: 1,
    x: 0.4,
    y: 0.72
  },
  {
    id: 2,
    x: 0.5,
    y: 0.42
  },
  {
    id: 3,
    x: 0.13,
    y: 0.12
  },
  {
    id: 4,
    x: 0.33,
    y: 0.9
  }
];

 var array_nodes = [];

 nodes.forEach(function(d) {
    array_nodes.push({
      x: d.x,
      y: d.y
    });
  });
  
  console.log(array_nodes);

score 1 · Answer 3 · answered May 07 '19 at 00:45

Just use map:

const nodes = [{id: 1,x: 0.4,y: 0.72},{id: 2,x: 0.5,y: 0.42},{id: 3,x: 0.13,y: 0.12},{id: 4,x: 0.33,y: 0.9}];
const array = nodes.map(({ x, y }) => [x, y]);
console.log(array);

.as-console-wrapper { max-height: 100% !important; top: auto; }

score 1 · Answer 4 · answered Mar 03 '22 at 11:20

What I understood is you want a new array of objects having only x & y keys, like:

[{x: 1, y: 2.12}, {x: 2.001, y: 9}]

This can be easily achieved by destructing object

const nodes = [{
    id: 1,
    x: 0.4,
    y: 0.72
}, {
    id: 2,
    x: 0.5,
    y: 0.42
}, {
    id: 3,
    x: 0.13,
    y: 0.12
}, {
    id: 4,
    x: 0.33,
    y: 0.9
}];

const mappy = nodes.map(({x, y}) => ({x, y}))
console.log(mappy);

How to extract two columns from an array

4 Answers4