如何从本地 geojson 文件在传单地图上添加点？答案

【问题标题】：How to add points on leaflet map from local geojson file?如何从本地 geojson 文件在传单地图上添加点？
【发布时间】：2020-03-24 21:25:33
【问题描述】：

我正在尝试在传单地图上显示本地 geojson 文件（使用立交桥 turbo 创建）中的点，但由于我是一个完全新手，所以我无法正确处理

这是我现在拥有的：

  var mymap = L.map('mapid').setView([57.1497, -2.0943], 13);

  var Esri_WorldGrayCanvas = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}', 
  {attribution: 'Tiles &copy; Esri &mdash; Esri, DeLorme, NAVTEQ', maxZoom: 16 }); 

  Esri_WorldGrayCanvas.addTo(mymap); 

  var CartoDB_Voyager = L.tileLayer('https://{s}.basemaps.cartocdn.com/rastertiles/voyager/{z}/{x}/{y}{r}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
    subdomains: 'abcd',
    maxZoom: 19
  });

  CartoDB_Voyager.addTo(mymap);

  L.geoJSON(geojsonFeature).addTo(mymap);

  $.ajax({
  dataType: "json",
  url: "AllAberdeen.geojson",
  success: function(data) {
      $(data.features).each(function(key, data) {
          console.log(result)

          result.features.forEach(function(point) {

              var lon = point.geometry.coodrinates.lon;
              var lat = point.geometry.coodrinates.lat;

              var circle = L.circle( [lon, lat], {
                  color: 'red',
                  opacity: 0,
                  fillColor: 'red', 
                  fillOpacity: 0.8
              })

              circle.addTo(mymap)
          });
      });
  }
  }).error(function() {});

如果有任何帮助，我将不胜感激

【问题讨论】：

您是否收到错误或出了什么问题？
什么都没有发生，当我在服务器上渲染我的页面时，地图加载得很好，但是我无法从 geojson 中获取点来显示它

标签： leaflet geojson

【解决方案1】：

尝试创建geoJson图层组：

  $.ajax({
  dataType: "json",
  url: "AllAberdeen.geojson",
  success: function(data) {
      console.log(data);
      L.geoJSON(data).addTo(mymap);
  }
  }).error(function(error) {
   console.log(error);
});

【讨论】：