使用 mapbox 时忽略 geojson

geojson ignored when using mapbox

为什么 mapbox 忽略我的 geoJson 标记符号、标记颜色和标记大小?如果出于某种原因它忽略了,你如何设置?

示例 geoJson:

"properties": {
      "id": 578202,
      "name": "University of North Carolina at Charlotte",
      "marker-symbol": "marker",
      "marker-color": "#ff8888",
      "marker-size": "small",
      "description": 1
    }

脚本:

$.getJSON(url, function(data) {
    var geojson = L.geoJson(data, {
        onEachFeature: function(feature, layer) {

           var popupContent = feature.properties.name +'project(s)';
            layer.bindPopup(popupContent, {
                closeButton: true,
                minWidth: 225
            });     
        }
    });
    var map = L.mapbox.map('map', '', {
        attributionControl: false
    });
    geojson.addTo(map);
});

发生这种情况是因为 L.GeoJSON 不会自动知道您要设置标记选项,因此如果遇到点要素,它只会添加一个默认标记。如果你想用点特征做一些特殊的事情,你可以使用L.GeoJSONpointToLayer函数,查看下面的例子:

var geoJsonLayer = L.geoJson(geoJson, {
    pointToLayer: function (feature, latLng) {
        return L.marker(latLng, {
            icon: L.mapbox.marker.icon(feature.properties)
        });
    }
}).addTo(map);

唯一的问题是它还将所有其他属性添加为标记图标的选项。就个人而言,我会编写一些逻辑,以便只将相关属性添加到图标选项中。

这是一个关于 Plunker 的工作示例:http://plnkr.co/edit/3OJPXxOYdzX8mSnjEb90?p=preview

正如 tmcw 在评论中指出的(见下文):您可以使用 L.mapbox.featureLayer,它完全可以完成您想要使用 L.GeoJSON 完成的工作,而无需求助于 pointToLayer 上面描述的方法,它只使用适当的属性。它甚至可以为您加载数据,这样您就可以摆脱 jQuery 的 $.getJSON。 Win/win 情况如果你问我。您只需执行以下操作即可:

L.mapbox.featureLayer(url).addTo(map);

这是 Plunker 上的工作示例:http://plnkr.co/edit/Og6tuYDIkTX7ftedoR3C?p=preview