使用JavaScript映射嵌套数组

Question

我正在尝试使用.map（）映射嵌套数组，以便可以在地图中显示和精确定位伦敦的所有地下位置。

this.undergroundGeoJson = [
        {
            'type': 'FeatureCollection',

            'crs': { 'type': 'name', 'properties': { 'name': 
            'urn:ogc:def:crs:OGC:1.3:CRS84' } },

            'features': [
                {
                    'type': 'Feature',
                    'geometry': {
                        'type': 'Point',
                        'coordinates': [-0.278126, 51.5025]
                    },
                    'properties': {
                        'name': 'Acton Town'
                    }
                },
                {
                    'type': 'Feature',
                    'geometry': {
                        'type': 'Point',
                        'coordinates': [-0.263033174, 51.50883531]
                    },
                    'properties': {
                        'name': 'Acton Central'
                    }
                },
                {
                    'type': 'Feature',
                    'geometry': {
                        'type': 'Point',
                        'coordinates': [-0.262879534, 51.50856013]
                    },
                    'properties': {
                        'name': 'Acton Central'
                    }
                }
           }
       ]

我需要几何obj中的坐标数组元素。

到目前为止，这是我的代码...

@computed
    get undergroundLatLongs() {
    return this.undergroundGeoJson.map((u) =>
    [u.features.geometry.coordinates[0], 
    u.features.geometry.coordinates[1]]);
}

这是错误日志...

Uncaught TypeError: Cannot read property 'coordinates' of undefined

任何帮助表示欢迎。

Answer 1

features是一个数组，您需要使用index访问它

 u.features[i].geometry.coordinates[0]
           ^^^

 const undergroundGeoJson =[{'type':'FeatureCollection','crs':{'type':'name','properties':{'name':'urn:ogc:def:crs:OGC:1.3:CRS84'}},'features':[{'type':'Feature','geometry':{'type':'Point','coordinates':[-0.278126,51.5025]},'properties':{'name':'ActonTown'}},{'type':'Feature','geometry':{'type':'Point','coordinates':[-0.263033174,51.50883531]},'properties':{'name':'ActonCentral'}},{'type':'Feature','geometry':{'type':'Point','coordinates':[-0.262879534,51.50856013]},'properties':{'name':'ActonCentral'}}],}]; const ret = undergroundGeoJson.map((u,i) => [ u.features[i].geometry.coordinates[0], u.features[i].geometry.coordinates[1], ]); console.log(ret); 

Answer 2

您正在尝试访问错误的数组features的属性geometry ，因此必须像这样映射它

u.features.map(f => f.geometry.coordinates[0])

您的最终代码应如下所示

 this.undergroundGeoJson = [{ 'type': 'FeatureCollection', 'crs': { 'type': 'name', 'properties': { 'name': 'urn:ogc:def:crs:OGC:1.3:CRS84' } }, 'features': [{ 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.278126, 51.5025] }, 'properties': { 'name': 'Acton Town' } }, { 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.263033174, 51.50883531] }, 'properties': { 'name': 'Acton Central' } }, { 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.262879534, 51.50856013] }, 'properties': { 'name': 'Acton Central' } } ] }] function undergroundLatLongs() { return this.undergroundGeoJson.map((u) => [u.features.map(f => f.geometry.coordinates[0]), u.features.map(f => f.geometry.coordinates[1])]); } console.log(undergroundLatLongs()); 

Answer 3

您正在尝试在undergroundGeoJson对象上使用.map() 。 .map()仅可用于数组。 我相信您正在尝试遍历this.undergroundGeoJson.features的对象数组？ 您必须这样做：

this.undergroundGeoJson.features.map(u => {
   console.log(u) // this will print each object within `features`
   return u; // don't forget to return something
})

Answer 4

由于map可以在数组中循环，因此您可以从this.undergroundGeoJson [0] .features开始映射

 this.undergroundGeoJson = [{ 'type': 'FeatureCollection', 'crs': { 'type': 'name', 'properties': { 'name': 'urn:ogc:def:crs:OGC:1.3:CRS84' } }, 'features': [{ 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.278126, 51.5025] }, 'properties': { 'name': 'Acton Town' } }, { 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.263033174, 51.50883531] }, 'properties': { 'name': 'Acton Central' } }, { 'type': 'Feature', 'geometry': { 'type': 'Point', 'coordinates': [-0.262879534, 51.50856013] }, 'properties': { 'name': 'Acton Central' } } ] }] function undergroundLatLongs() { return this.undergroundGeoJson[0].features.map((u) => [u.geometry.coordinates[0], u.geometry.coordinates[1]]); } var x= undergroundLatLongs(); console.log(x);