How to merge an array into another array's object value

January 25, 2022

I’m having two set of data as below:

let loadedData = [
    [
      {
        y: 12,
        x: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
      },
      {
        x: 10,
        y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
      }
    ],
    [
      {
        x: 32,
        y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
      }
    ]
];

and

let seriesData = [
  {
    name: 'Graph',
    type: 'Column',
    data: []
  },
  {
    name: 'Graph',
    type: 'line',
    data: []
  }
];

I want to add loadedData’s values inserted into seriesData’s data property. The expected result should be like this.

result = [
  {
    name: 'Graph',
    type: 'Column',
    data: [
          {
            y: 12,
            x: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
          },
          {
            x: 10,
            y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
          }
        ],
  },
  {
    name: 'Graph',
    type: 'line',
    data: [
          {
            x: 32,
            y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
          }
        ]
  }
];

I looked around for solutions but I couldn’t find one that suits my criteria. Here’s what I tried.

let loadedData = [
  [{
      y: 12,
      x: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
    },
    {
      x: 10,
      y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
    }
  ],
  [{
    x: 32,
    y: 'Tue Sep 14 2021 05:15:38 GMT-0700 (Pacific Daylight Time)'
  }]
];

let seriesData = [{
    name: 'Graph',
    type: 'Column',
    data: [],
  },
  {
    name: 'Graph',
    type: 'line',
    data: []
  }
];


for (let i = 0; i < loadedData.length; i++) {
  const series = this.widget.config["options"].map((type) => {
    console.log(type.graphType);
    let el = [];
    this.loadedData.forEach(element => {
      el.push(element);
    });
    return {
      name: type.sensor.sensorType,
      type: type.graphType,
      data: el[i]
    };
  });
  seriesData = series;
}

>Solution :

If you don’t need a copy of seriesData and loadedData then .forEach() is all you need

seriesData.forEach((serie, index) => {
  serie.data = loadedData[i] || serie.data;
});

let loadedData = [
    [ { x: 12, y: 'a' }, { x: 10, y: 'b' } ],
    [ { x: 32, y: 'c' } ]
];

let seriesData = [
  { name: 'Graph', type: 'Column', data: [] },
  { name: 'Graph', type: 'line', data: [] }
];

seriesData.forEach((serie, index) => {
  serie.data = loadedData[index] || serie.data;
});

console.log(seriesData);

If you need an copy:

const result = seriesData.map((serie, index) => {
  return {
    ...serie,
    data: (loadedData[index] || serie.data).map(d => Object.assign({}, d))
  };
});