I just started using Leaflet and Marker Clusterer to organize the markers.

Problem #1: When an unclustered marker is clicked, no popup appears.

Problem #2: When a cluster is clicked several times, all the markers within that cluster appears, and when one of this marker is clicked, its popup appears! However, after closing the popup by clicking on the map, clicking on any of these clustered markers again do not open any popups!

If I only have 3 unclustered markers, the popup works fine. However, as more markers are added, once a cluster forms, clicking on the marker within any cluster will not cause the popup to open!

Initializing markerclusterer

markers = new L.MarkerClusterGroup();

All markers added to markercluster markers

A loop calls on the render function to create the marker and add it to the markerclusterer's array markers. (ignore the 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});

        // Add to markerclusterer

Without markerclusterer

If I add the marker directly to map instead of the markerclusterer array markers, the popups work fine, so I guess the problem has something to do with markerclusterer.

Did I do something wrong that resulted in such behavior of the popups? All help appreciated, thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.