Prospektmarkierungen öffnen beim Klicken kein Popup

Question

Ich habe gerade angefangen, Leaflet zu verwenden und Marker-Cluster um die Markierungen zu organisieren.

Problem Nr. 1: Wenn auf eine nicht gruppierte Markierung geklickt wird, wird kein Popup angezeigt.

Problem Nr. 2: Wenn ein Cluster mehrmals angeklickt wird, erscheinen alle Marker innerhalb dieses Clusters, und wenn einer dieser Marker angeklickt wird, erscheint sein Popup!Nachdem Sie das Popup jedoch durch Klicken auf die Karte geschlossen haben, werden beim Klicken auf eine dieser gruppierten Markierungen keine Popups geöffnet!

Wenn ich nur 3 nicht gruppierte Marker habe, funktioniert das Popup einwandfrei.Wenn jedoch weitere Markierungen hinzugefügt werden und sich ein Cluster bildet, wird durch Klicken auf die Markierung innerhalb eines Clusters das Popup nicht geöffnet!

Markerclusterer wird initialisiert

markers = new L.MarkerClusterGroup();
map.addLayer(markers);

Alle Marker zum Markercluster hinzugefügt markers

Eine Schleife ruft auf render Funktion zum Erstellen der marker und fügen Sie es dem Array des Markerclusterers hinzu markers. (ignorieren Sie den backbone.js-Code)

ListingMarkerView = Backbone.View.extend({
    template: _.template( $('#tpl_ListingMarkerView').html() ),

    render: function() {

        // Create marker
        var content = this.template( this.model.toJSON() );
        var marker = new L.marker(
            [this.model.get('lat'), this.model.get('lng')],
            {content: content});
        marker.bindPopup(content);

        // Add to markerclusterer
        markers.addLayer(marker);
    }
});

Ohne Markercluster

Wenn ich das hinzufüge marker direkt zu map anstelle des markerclusterer-Arrays markers, die Popups funktionieren einwandfrei, daher vermute ich, dass das Problem etwas mit markerclusterer zu tun hat.

Habe ich etwas falsch gemacht, das zu einem solchen Verhalten der Popups geführt hat?Jede Hilfe wird geschätzt, danke!

Answer 1

Nach dem Wenigen, das ich über die Cluster-Marker-Gruppe weiß, sollten Sie Folgendes tun:

var markerGroup = new L.MarkerClusterGroup();
markerGroup.on('click', function(ev) {
    // Current marker is ev.layer
    // Do stuff
});

Um stattdessen einen Event-Handler zur Cluster-Ebene hinzuzufügen, gehen Sie wie folgt vor:

markerGroup.on('clusterclick', function(ev) {
    // Current cluster is ev.layer
    // Child markers for this cluster are a.layer.getAllChildMarkers()
    // Do stuff
});

Oh, und lies den Github Liesmich Vorsicht, es ist alles da drin...

Answer 2

Stellen Sie sicher, dass Sie die richtigen Versionen von allem in Ihrem Leaflet + Clusterer-Stack (JS und CSS) haben.Vergleichen Sie mit den Beispielen im Clusterer-Github-Repo.