如何将JSON转换为GeoJSON [英] How to convert JSON to GeoJSON

问题描述

我对javascript的学习非常陌生，而我的基础知识已经碰壁了.我已经设置了一个Leaflet映射，希望从JSON的电线上绘制基于divIcon的标记.通过我无数次尝试使其工作的研究.我了解了为什么即使在控制台中确认正在读取JSON文件也无法正常工作的原因.我了解到Leaflet希望将其包含在GeoJSON中.所以我花了几个小时研究如何转换它.我的大部分发现已经过时，不再起作用或不适用于我.这是我通过严格的研究所做的尝试.

I am very new in my learnings of javascript and my rudimentary knowledge has hit a wall. I have setup a Leaflet map which I am wishing to plot divIcon based markers from cords on it from JSON. Through my countless research of trying to get it to work. I learned why my JSON file wasn't working even though I confirmed in the console it was being read. I learned Leaflet prefers it to be in GeoJSON. So I spent several more hours researching how to convert this. Most of my findings were outdated and did not work anymore or did not apply to me. This is what I did try through my rigorous research.

首先，我像这样定义了我的测试JSON文件路径的变量.

To start off I have set a variable for the path to my test JSON file as defined like this.

var jsonData = "./data/tracking.json";

在尝试将JSON转换为GeoJSON时，我尝试了此操作.

In my attempt to convert the JSON to GeoJSON I tried this.

var outGeoJson = {}
outGeoJson['properties'] = jsonData
outGeoJson['type']= "Feature"
outGeoJson['geometry']= {"type": "Point", "coordinates":
    [jsonData['lat'], jsonData['lon']]}

console.log(outGeoJson)

检查了控制台，发现来自JSON文件的数组中的坐标未定义.

Checked the console and found the coordinates in the array from JSON file are undefined.

我对导致这种情况不确定的原因的搜索失败了.我在这里的理论可能是因为JSON在数组之前具有位置关键，而事实是它是数组.我继续寻找可能解决此问题的有效解决方案.接下来，我尝试了此解决方案.

My search for a reason why this was coming up undefined fell short. My theory here is maybe because the JSON has a key of positions prior to the array and the fact it is an array. I continue to search for a valid solution that could possibly handle this issue. I tried this solution next.

var geojson = {
  type: "FeatureCollection",
  features: [],
};

for (i = 0; i < jsonData.positions.length; i++) {
  if (window.CP.shouldStopExecution(1)) {
    break;
  }
  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
    }
  });
}

window.CP.exitedLoop(1);

console.log(geojson)

此解决方案在Uncaught TypeError: Cannot read property 'length' of undefined控制台中给我一个错误.

This solution gave me an error in the console of Uncaught TypeError: Cannot read property 'length' of undefined.

试图对该解决方案进行数小时的故障排除，但效果也很差.这是我正在使用的测试JSON文件的示例.

Attempted to troubleshoot that solution for several more hours and that has fallen short as well. Here is a sample of the test JSON file I am working with.

{
  "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，lat，lon，dir，first，last.剩下的我无能为力.我尝试过的上述示例是否是转换它的好方法?如果不是这样，那么有没有人比我一直在尝试的更好的建议，就是我可能会想念或遗忘我，因为这种语言非常绿色，所以这是一个很好的可能性?预先感谢！

All I really need from it is the report_at, lat, lon, dir, first, last anyways. The rest I can do without. Is the above mentioned examples I tried a good or proper way to convert it? If not, then does anyone have a better suggestion than what I have been trying that I might be missing or overlooking which is a pretty good possibility due to be very green to this language? Thanks in advance!

编辑:由于已引起我注意，我并未加载JSON文件，因此已完成加载工作，因为建议不适用于Node.js和不是本地javascript的一部分.

Since it has been brought to my attention I am not loading the JSON file this is what I have done to load it since the suggestions do not work as they apply to node.js and not a part of native javascript.

    $.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)
});

这确实加载了在控制台中显示为转换为GeoJSON的文件.除非有更好的解决方案，否则我将保持现状.

This does load the file as it is displaying in the console as converted to GeoJSON. I will leave this as is for now unless there is a better solution.

推荐答案

如果您确实在项目中添加了jQuery，那么您就快到了:

If you do have jQuery in your project added, then you are almost there:

$.getJSON("./data/tracking.json", function(jsonData) {
    /* 
    Here the anonymous function is called when the file has been downloaded.
    Only then you can be sure that the JSON data is present and you can work with it's data.
    You have to keep in mind if you are getting the file synchronously or asynchronously (default).
   */
});

这篇关于如何将JSON转换为GeoJSON的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！