GeoJson 对象作为传单标记答案

【问题标题】：GeoJson object as Leaflet MarkersGeoJson 对象作为传单标记
【发布时间】：2015-06-28 15:19:50
【问题描述】：

我正在尝试基于存储在 gist 中的 json 文件来可视化 Leaflet Marker。到目前为止，我还没有管理，因为我的 web 地图 (http://geo.uzh.ch/~gboo/netap/netap.html) 仅显示基本地图而不显示标记。

当我在 Firefox 中检查网页时，它给了我这个错误：

TypeError: undefined is not a function (near '...}).addTo(map);...')

这里是代码片段：

$(document).ready(function() {

var map = L.map('map', { 
            center: [46.798333, 8.231944], 
            zoom: 8,    
            minZoom: 9,
            maxZoom: 16,
            zoomControl:true
        });

        L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                attribution: '<a href="http://openstreetmap.org">OpenStreetMap</a>' 
        }).addTo(map)   


    $.getJSON("https://gist.githubusercontent.com/netapschweiz/13d37c1ee99e2c052246/raw/f64297e6bc783c1af5844921012116703fd37e0d/map.geojson", {
        pointToLayer: function(feature, latlng) {
            var smallIcon = L.icon({
                      iconSize: [27, 27],
                      iconAnchor: [13, 27],
                      popupAnchor:  [1, -24],
                      iconUrl: 'www.geo.uzh.ch/~gboo/netap/img/catMarker.png'
                      });
                      return L.marker(latlng, smallIcon);
    }
}).addTo(map);
});

有人可以帮我吗？非常感谢！

【问题讨论】：

什么，确切地说，这段代码没有做你认为它应该做的事情？请帮助我们为您提供帮助！
如您所见，我的网络地图仅显示基本地图而不显示标记。当我在 Firefox 中检查网页时，它给了我这个错误：TypeError: undefined is not a function (near '...}).addTo(map);...')
我建议您编辑您的问题以反映这一点。
完成。我希望它有所帮助。

标签： leaflet geojson

【解决方案1】：

您的困惑的核心似乎是认为$.getJSON 与L.geoJson 有某种关系。它没有：$.getJSON 是一个获取数据的 jQuery 函数，L.geoJson 是一个将数据放在地图上的 Leaflet 函数。要修复此代码，您需要阅读 $.getJSON 的 jQuery 文档（说明您需要提供回调作为第二个参数）和 L.geoJson 的 Leaflet 文档（说明您需要提供数据作为第一个参数）。

【讨论】：

那是一个没有答案的...还是谢谢你。

【解决方案2】：

这就是要走的路：

  var geojsonMarkerOptions = L.icon({
        iconUrl: 'http://',
        iconSize:     [30, 30],
        iconAnchor:   [15, 15],
        popupAnchor:  [0, -15]
    });

    $.getJSON('http://', function(data) {
            L.geoJson(data, {
        pointToLayer: function (feature, latlng) {
            return L.marker(latlng, {icon: geojsonMarkerOptions})
        }})
    }).addTo(map);

【讨论】：