在 Leaflet 上绘制 GeoJSON答案

【问题标题】：Draw GeoJSON on Leaflet在 Leaflet 上绘制 GeoJSON
【发布时间】：2016-05-05 17:44:37
【问题描述】：

由于我没有发现 Leaflet 网站上的示例非常有用，因此我尝试按照他们的一般提示在地图上绘制我的 GeoJSON 作为轨迹。问题是，该对象已正确保存，但是当我将其添加到地图时，它不显示任何内容。我在这里想念什么？我是传单的新手。谢谢。

代码：

...

$.ajax('2016-05-04 13-13-36.gpx').done(function(response) {
    geo = toGeoJSON.gpx(response);
});

angular.element($elem[0]).append(angular.element('<div id="trackmap'+ trackmapCount +'" style="width: 100%; height: calc(100% - 25px); border: 1px solid #ccc"></div>'));
trackmaps[trackmapCount] = new L.Map('trackmap'+ trackmapCount +'', {center: new L.LatLng(center[0], center[1]), zoom: 10});
var layer1 = osm.addTo(trackmaps[trackmapCount]);

L.geoJson(geo, {
style: myStyle
}).addTo(trackmaps[trackmapCount]);

【问题讨论】：

标签： javascript leaflet geojson

【解决方案1】：

$.ajax 是一种异步方法。这意味着geo 在请求完成并调用.done 回调函数之前不存在。您需要在回调中创建 L.geoJson 对象：

$.ajax('2016-05-04 13-13-36.gpx').done(function(response) {
  geo = toGeoJSON.gpx(response);
  L.geoJson(geo, {
    style: myStyle
  }).addTo(trackmaps[trackmapCount]);
});

【讨论】：