Какой лучший способ конвертировать JSON в GeoJSON для карты листовки - PullRequest
Новая
       22

Какой лучший способ конвертировать JSON в GeoJSON для карты листовки

0 голосов
/ 28 апреля 2019

Я хотел преобразовать JSON в GeoJSON, чтобы отобразить divIcons на карте Leaflet из файла JSON, который я получаю из API. Будучи новичком в javascript, мне очень трудно найти рабочее решение. Я думал, что моя проблема была решена в моем другом посте Как конвертировать JSON в 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, если он показывает данные внизу, Я до сих пор не думаю, что он загружается правильно.

enter image description here

Второй метод, который я попробовал, который мне нравится, так как я могу извлечь только те ключи, которые мне нужны, из файла 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)
    });

enter image description here

Это то, что я пробовал до сих пор наряду с бесчисленным множеством других методов, которые сделали бы этот пост слишком длинным для перечисления. Есть ли лучший и более новый способ сделать это, чем то, что я пытаюсь сделать, это проще или есть что-то, что я просто пропускаю в приведенном выше коде, что-то новое для этого языка? Я действительно предпочитаю этот второй метод, если у кого-то нет гораздо лучшего предложения для преобразования JSON в GeoJSON, поэтому я могу проанализировать его на своем слое GeoJSON.

EDIT:

Вот пример исходного ответа JSON от API, который я пытаюсь преобразовать в 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"
    }
}

1 Ответ

1 голос
/ 29 апреля 2019

  • в вашем первом примере кода вы пытаетесь заполнить ваши координаты GeoJSON из ваших jsonData['lat'] и lon, но ваш скриншот ниже показывает, что ваша переменная jsonData имеет только элемент positions, который является массивом, который в свою очередь содержит объекты с элементами lat и lon.

  • во втором примере кода, вы пытаетесь заполнить ваши координаты на этот раз из jsonData.positions[i].longitude и широты. Но опять же, ваши элементы positions имеют не долготу и широту, а долготу и широту. Вы правильно ссылаетесь на них при заполнении ваших свойств GeoJSON чуть ниже.

  • координаты должны быть преобразованы в числа (вы можете использовать parseFloat)

  • Порядок координат GeoJSON должен быть сначала долготой, а затем широтой.

...