将 Leaflet 地图的 JSON 转换为 GeoJSON 的更好方法是什么

What is the better method to convert JSON to GeoJSON for Leaflet map

我想将 JSON 转换为 GeoJSON,以便在来自 JSON 文件的 Leaflet 地图上绘制 divIcons,该文件是从 API 获得的。作为 javascript 的新手,我很难找到可行的解决方案。我以为我的问题已经在我的其他 post How to convert JSON to GeoJSON 中解决了 但这只解决了一个难题,我不知道如何将数据加载到我认为是我的问题的代码中。我仍然在努力寻找将 JSON 转换为 GeoJSON 的可行解决方案,以便我能够从那里使用它在地图上绘制 divIcons。

我在这里、YouTube 和其他几个网站上做了很多研究,其中大多数都是过时的答案,这些答案似乎不起作用或不适用于我的情况。我尝试将 JSON 转换为 GeoJSON 的方法之一就是这个。

$.getJSON("./data/tracking.json", function(jsonData) {
  var outGeoJson = {}
  outGeoJson['properties'] = jsonData
  outGeoJson['type']= "Feature"
  outGeoJson['geometry']= {"type": "Point", "coordinates":
      [jsonData['lat'], jsonData['lon']]}

  console.log(outGeoJson)
}); 

虽然我认为它在工作,但在睡了一会后仔细检查控制台后,我注意到坐标仍在显示 Undefined 所以它没有将它转换为 GeoJSON 如果虽然它在底部显示数据,我仍然认为它加载不正确。

我尝试的第二种方法,我喜欢,因为我只能从 JSON 文件中提取我需要的键,所以我可以在弹出窗口中使用它,结果与上面一个。

$.getJSON("./data/tracking.json", function(jsonData) {
var geojson = {
  type: "FeatureCollection",
  features: [],
};

for (i = 0; i < jsonData.positions.length; i++)



    geojson.features.push({
        "type": "Feature",
        "geometry": {
          "type": "Point",
          "coordinates": [jsonData.positions[i].longitude, jsonData.positions[i].latitude]
        },
        "properties": {
          "report_at": jsonData.positions[i].report_at,
          "lat": jsonData.positions[i].lat,
          "lon": jsonData.positions[i].lon,
          "dir": jsonData.positions[i].dir,
          "first": jsonData.positions[i].first,
          "last": jsonData.positions[i].last
        }
      });

    console.log(geojson)
    });

这就是我迄今为止尝试过的方法以及无数其他方法,这些方法会使 post 太长而无法列出。有没有比我正在尝试的更容易的更好和更新的方法来完成这个,或者我在上面的代码中忽略的东西是这种语言的新东西?我真的更喜欢第二种方法,除非有人有更好的建议将 JSON 转换为 GeoJSON,这样我就可以在我的 GeoJSON 层中解析它。

编辑:

这是来自 API 的原始 JSON 响应的示例,我正在尝试将其转换为 GeoJSON

{
  "positions": [
    {
      "report_at": "2015-01-21 21:00:08",
      "lat": "38.9080658",
      "lon": "-77.0030365",
      "elev": "0",
      "dir": "0",
      "gps": "0",
      "callsign": "WX2DX",
      "email": "",
      "phone": "",
      "ham": "WX2DX",
      "ham_show": "0",
      "freq": "",
      "note": "",
      "im": "",
      "twitter": null,
      "web": "",
      "unix": "1421874008",
      "first": "William",
      "last": "Smith",
      "marker": "36181"
    },
    {
      "report_at": "2015-01-21 11:45:12",
      "lat": "39.2716141",
      "lon": "-76.6192093",
      "elev": "0",
      "dir": "0",
      "gps": "0",
      "callsign": "rldovejr",
      "email": null,
      "phone": null,
      "ham": null,
      "ham_show": null,
      "freq": null,
      "note": null,
      "im": null,
      "twitter": null,
      "web": null,
      "unix": "1421840712",
      "first": "Ron",
      "last": "Dove",
      "marker": "13573"
    }
}
  • 在您的第一个代码示例中,您尝试从 jsonData['lat'] 和 lon 填充 GeoJSON 坐标,但下面的屏幕截图显示您的 jsonData 变量只有一个 positions 成员,这是一个数组,它又包含具有 lat 和 lon 成员的对象。

  • 在您的第二个代码示例中,您这次尝试根据 jsonData.positions[i].longitude 和纬度填充您的坐标。但同样,您的 positions 项没有经度和纬度,但有经度和纬度。在下方填充 GeoJSON 属性时,您可以正确引用这些内容。

  • 坐标要转成数字(可以用parseFloat)

  • GeoJSON 坐标顺序应该是经度在前,纬度在后。