使用自定义标记进行传单聚类

时间:2014-10-20 21:04:10

标签: leaflet markerclusterer

我刚开始使用传单。我的问题是如何对自定义标记进行聚类,这些标记就像这样添加到地图

var LeafIcon = L.Icon.extend({
options: {
    iconSize:     [38, 95],     
    shadowSize:   [50, 64], 
    iconAnchor:   [22, 94], 
    popupAnchor:  [-3, -10]
    }
});

var greenIcon = new LeafIcon({iconUrl: 'http://leafletjs.com/docs/images/leaf-green.png'}),
redIcon = new LeafIcon({iconUrl: 'http://leafletjs.com/docs/images/leaf-red.png'}),
orangeIcon = new LeafIcon({iconUrl: 'http://leafletjs.com/docs/images/leaf-orange.png'});


L.marker([51.5, -0.071], {icon: greenIcon}).bindPopup("<p>ok</p><p>tada</p>.").addTo(map);
L.marker([51.5, -0.073], {icon: redIcon}).bindPopup("I am a red leaf.").addTo(map);
L.marker([51.5, -0.076], {icon: orangeIcon}).bindPopup("I am an orange leaf.").addTo(map);

我正在努力将其添加到MarkerClusterGroup。

请在这里找到一个工作小提琴:http://jsfiddle.net/6uovronb/

谢谢!

1 个答案:

答案 0 :(得分:0)

我更新了您的fiddle并将您的标记添加到标记组。

以下是一些示例代码:

var markers = new L.MarkerClusterGroup();
    markers.addLayer(L.marker([51.5, -0.071], {
        icon: greenIcon
    }).bindPopup("<p>ok</p><p>tada</p>."));

在一个稍微不相关的说明中,我从未使用过标记集群,但这是一个非常漂亮的传单插件。