Leaflet 传单中的自定义图标不工作

当我有geojson数据源时，使用传单文档中显示的自定义图标的标准方法不适用于我。该层添加良好，但使用默认标记图标。当我检查DOM时，没有引用我的自定义图标PNG。这是我的密码：

    var crossIcon = L.icon({
            iconUrl: 'plus.png',
            shadowUrl: 'marker-shadow.png',
            iconSize: [11, 11],
            shadowSize: [11, 11],
            iconAnchor: [6, 6],
            shadowAnchor: [5, 5],
            popupAnchor: [5, 5]
    });


    var points = L.geoJson(labels, {
            icon: crossIcon
    });
    map.addLayer(points);
    layerControl.addOverlay(points, 'Site Locations');

---

我尝试了一些在某某和其他地方找到的建议，但都没有成功。plus.png位于/lib/images/中，其中还可以找到默认图标。

查看GeoJson的API，在为

图标创建L.GeoJson层时，没有此类选项。我相信您可能正在寻找，多段线和多边形，或指定图标的选项

传单上的网站显示了这种情况。看棒球运动员的图标

图标的定义如下：

var baseballIcon = L.icon({
        iconUrl: 'baseball-marker.png',
        iconSize: [32, 37],
        iconAnchor: [16, 37],
        popupAnchor: [0, -28]
    });

图标通过指定函数的
pointToLayer
选项应用于
L.geoJson
层；像这样：

var coorsLayer = L.geoJson(coorsField, {
        pointToLayer: function (feature, latlng) {
            return L.marker(latlng, {icon: baseballIcon});
        }
    })

var points = L.geoJson(labels, {
        pointToLayer: function (feature, latlng) {
            return L.marker(latlng, {icon: crossIcon });
        }
});

将为每个GeoJSON点调用此函数。该函数将返回使用指定图标的
L.Marker

因此，要回答您的问题：创建图层的代码块应该如下所示：

var coorsLayer = L.geoJson(coorsField, {
        pointToLayer: function (feature, latlng) {
            return L.marker(latlng, {icon: baseballIcon});
        }
    })

var points = L.geoJson(labels, {
        pointToLayer: function (feature, latlng) {
            return L.marker(latlng, {icon: crossIcon });
        }
});

您可以将其添加为标记，而不是将其添加为geojson层

var crossIcon = L.icon({
        iconUrl: 'plus.png',
        shadowUrl: 'marker-shadow.png',
        iconSize: [11, 11],
        shadowSize: [11, 11],
        iconAnchor: [6, 6],
        shadowAnchor: [5, 5],
        popupAnchor: [5, 5]
});

       L.marker(icon:crossIcon);