从图层中获取传单标记

Question

我是 leaflet 的新手，我正在尝试实现一组具有不同 CSS 样式的标记。

因此，我知道在向地图添加标记后，我可以通过在我的标记上调用 getElement() 来访问不同的 CSS 属性，例如：

    marker.addTo(map);
    marker.getElement().style.borderColor = '#000';

这很好用，但是当向图层添加标记时，由于发生 TypeError（getElement() 未定义），因此无法再使用。这是发生错误的示例代码：

    myLayer.addLayer(marker);
    marker.getElement().style.borderColor = '#000';

我是否忽略了一种更简单的方法来设置 CSS- 添加到图层的标记和 divicons 的属性，或者是否有类似的方法来访问 JavaScript 中添加的图层标记和 divicons？

Answer 1

欢迎来到 SO！

当未添加到地图上时（因为您的父 myLayer 可能未添加到地图本身），标记没有任何元素。

如果您不需要单独和动态地更改太多样式，您可能更愿意使用 Icon / DivIcon 的 className 选项。

Answer 2

所以我找到了适合我的解决方案。这个想法是扩展用于创建图标的功能。最后的答案在这里 github.com/Leaflet/Leaflet/issues/5231 帮助很大。

    var borderSize = ...;
    L.DivIcon.Custom = L.DivIcon.extend({
        createIcon: function(oldIcon) {
               var icon = L.DivIcon.prototype.createIcon.call(this, oldIcon);
               icon.style.borderSize = borderSize;
               ...
               return icon;
        }
    })
    var icon = new L.DivIcon.Custom({
        ...
    });        
    var ll = L.latLng(entry.Longitude, entry.Latitude);
    var marker = L.marker(ll, {
      icon: icon
    })
    this.myLayer.addLayer(marker);

从图层中获取传单标记

Get leaflet marker from a layer

leaflet

markers