在鼠标悬停时显示集群中标记的名称

Question

我正在尝试显示带有聚类标记的地图，在单击放大之前，用户可以在鼠标悬停时看到聚类中标记的名称。

这是我一直在研究的示例： http : //jsfiddle.net/zvLd54de/4/

目的是在伦敦的鼠标悬停时应显示居住在伦敦的四个人的名字，而在巴黎的鼠标悬停时应显示居住在巴黎的三个人的名字。

到目前为止，我只管理了一个

• 显示名称，但显示地图视图中的所有标记
• 显示集群中的对象，但不显示名称

使用Javascript

markers.on('clustermouseover', function (a) {

    var inBounds = [],
        bounds = map.getBounds();
    children = a.layer.getAllChildMarkers();

    markers.eachLayer(function (marker) {    
        if (bounds.contains(marker.getLatLng())) {
            inBounds.push(marker.options.title);
        }
    });

    document.getElementById('names').innerHTML = inBounds.join('\n');
    document.getElementById('children').innerHTML = children.join('\n');    
});

markers.on('clustermouseout', function (a) {
    document.getElementById('names').innerHTML = ('');
    document.getElementById('children').innerHTML = ('');
});

我认为我需要以某种方式修改if语句，以便它仅将名称推送到群集中，但还没有找到方法。

如果有人对如何执行此操作有任何想法，我将不胜感激。

Answer 1

经过更多尝试后，我找到了解决方案。

可以在http://jsfiddle.net/zvLd54de/5/上查看更新后的示例。

我希望这也会对其他人有用。

markers.on('clustermouseover', function (a) {

    children = a.layer.getAllChildMarkers();
    var names = [];

    for (i = 0; i < children.length; i++) {
        names.push(children[i].options.title);
    }

    document.getElementById('names').innerHTML = names.join('\n');  
});