首页 文章

从GeoJSON文件中读取纬度和经度，然后使用Leaflet将每个lat-long显示为标记

提问于
浏览 次
0

我是Javascript的新手，因此我有点失落 . 我能够从GeoJSON文件中读取;但是，我不明白如何遍历文件以获得点的Lat-Long，然后在Leaflet中将这些点显示为标记 . 我希望也能使用插件Awesome Markers（基于font-awesome，适用于Leaflet）

这是我的GeoJSON文件的示例：

{ "type": "FeatureCollection",
      "features": [
         { "type": "Feature", "properties": { "Street Nam": "Aljunied Avenue 2", " Block": "118 Aljunied Avenue 2", " Postal Co": "380118", " Latitude": 1.320440, "Longitude": 103.887575 }, 
           "geometry": { "type": "Point", "coordinates": [ 103.887575, 1.320440 ] } }
      ,
      { "type": "Feature", "properties": { "Street Nam": "Aljunied Crescent", " Block": "97A Aljunied Crescent", " Postal Co": "381097", " Latitude": 1.321107, "Longitude": 103.886127 }, 
        "geometry": { "type": "Point", "coordinates": [ 103.886127, 1.321107 ] } }
    ]
    }

感谢您的关注和时间=）

javascript leaflet geojson font-awesome

2 回答

  • 1

    按照the leaflet documentation中的描述处理geojson . 指定pointToLayer函数，该函数创建带有令人敬畏的图标的标记：

    L.geoJson(geoJson, {
    pointToLayer: function (feature, latlng) {
        return L.marker(latlng, 
            {icon: L.AwesomeMarkers.icon( 
                 << options based on feature.properties >> 
             )});
    }
}).addTo(map);
    回复于
  • 0

    读取文件后，您应该有一个表示文件中所有数据的javascript对象：

    var geoData = JSON.parse(fileContents);
var features = geoData.features;

    等等 . 解析后的数据将转换为对象或数组，具体取决于它们是键/值字典还是仅列表 . 所以从上面来看

    var feature = geoData.features[0];

    将为您提供列表中第一个要素对象的引用 . 如果你写

    console.log(geoData);

    并且可以使用任何最近的浏览器运行，您应该能够看到数据的可扩展描述，以帮助理解所有这些 .

    回复于

相关问题