Flatten array within array

Question

I'm getting data from a geojson file and I want to flatten an array within an array to be able to show this data within a material table.

I have the following code:

          const geoListData: Array<any> = [];
          const features = geoData.features; // feature array
          const latIdx = 0;
          const lonIdx = 1;

          // iterate over each feature
          features.forEach((feature: any) => {
            const geoListArray: any = [];

            // build up GeoListEntry
            const geoListEntry: GeoListEntry = {
              name: feature.properties.name,
              category: feature.properties.category,
              lat: feature.geometry.coordinates[latIdx],
              lon: feature.geometry.coordinates[lonIdx],
              prio: feature.properties.prio
            };

            geoListArray.push(geoListEntry);

            // get values from geojson
            feature.properties.values.forEach((element: any) => {
              const valuesEntry: any = {
                [element.name]: element.value
              };
              geoListArray.push(valuesEntry);
            });

            this.logger.debug(`geoListArray: ${JSON.stringify(geoListArray)}`);

            geoListData.push(geoListArray);
          });

      return geoListData;
    }));

My logger output looks like that:

[{"name":"90","category":"Arc 12 month","lat":7.613333333,"lon":47.555555,"prio":0},{"bearing":12345},{"intensity_mean":0},{"intensity_min":0},{"intensity_max":0}]

But I want something like that:

[{"name":"90","category":"Arc 12 month","lat":7.613333333,"lon":47.555555,"prio":0,"bearing":12345,"intensity_mean":0,"intensity_min":0,"intensity_max":0}]

I'm close, but I can't find the solution.

Do you have any idea?

Answer 1

Instead of pushing it to array , add property directly to the object

// iterate over each feature
features.forEach((feature: any) => {
  const geoListArray: any = [];

  // build up GeoListEntry
  const geoListEntry: GeoListEntry = {
    name: feature.properties.name,
    category: feature.properties.category,
    lat: feature.geometry.coordinates[latIdx],
    lon: feature.geometry.coordinates[lonIdx],
    prio: feature.properties.prio
  };

  // get values from geojson
  feature.properties.values.forEach((element: any) => {
    geoListEntry[element.name] = element.value
  });

  geoListArray.push(geoListEntry);

  this.logger.debug(`geoListArray: ${JSON.stringify(geoListArray)}`);

  geoListData.push(geoListArray);
});

Answer 2

Well technically it's not an array of arrays, but rather a collection of objects that you want to merge :

 const data = [ { id: 1 }, { lat: 10 }, { lng: 20 }, ]; console.log(data.reduce((p, n) => ({...p, ...n}), {})); 

Just in case you really want a flattening function, here it goes :

 const data = [ [{ id: 1 }], [{ lat: 10 }], [{ lng: 20 }], ]; console.log(Array.prototype.concat.apply([], data)); 

Mixing the two ?

 const data = [ [{ id: 1 }], [{ lat: 10 }], [{ lng: 20 }], ]; console.log((Array.prototype.concat.apply([], data)).reduce((p, n) => ({...p, ...n}), {}));