Question

我正在尝试从JSON API url获取对象密钥，从server获得纬度和经度的内容。对象密钥上的数据json api内容和这些密钥一直在变化。我只想获取那些“对象”键内部的坐标，并将其作为数组添加到传单地图标记中，然后在地图上显示。但是问题是我有Error: Uncaught (in promise): Error: Invalid LatLng object: (undefined, undefined)

  //coords
  points: Array<any> = [];

  // short data json
   data =[
{

  "22a7f183": [
    "502F0C",
    56.9227,
    23.9790,
    16,
    0,
    0,
    "0000",
    "T-EVRA43",
    "",
    "",
    1573389319,
    "RIX",
    "",
    "",
    1,
    0,
    "GPSMONT",
    0,
    ""
  ],
}]

  MarkerMap() {      

      this.points = Object.keys(this.data)
      .map(key => this.data[key])
      .map((position) => ({
        lat: position[1],
        lng: position[2]
      }));
      this.points.forEach((point) => {

        L.marker([point.lat,point.lng]).addTo(globalMap)
        .bindPopup('Ionic 4 <br> Leaflet.')
        .openPopup();
        console.log(point.lat,point.lng)


      });
    }

我又如何避免在数组内部出现空对象？

Live Code

Answer 1

您的数据源是什么？也许某些记录没有坐标？你确认了吗？

如果数组中的元素不完整，则可以使用filter方法过滤数组：

this.points = Object.keys(this.data)
  .map(key => this.data[key])
  .map((position) => ({
    lat: position[1],
    lng: position[2]
  }))
  .filter(position => position.lat && position.lng);

另外，您应该检查坐标是数字。

传单：无效的LatLng对象：（未定义，未定义）

1 个答案: