Question

Is there any way to prevent individual markers from being clustered with MarkerClusterer?

Here would be my code:

google.maps.event.addListener(marker, 'click', function() {
    // prevent marker from being clustered here
});

I know I could remove the marker from the MarkerClusterer object and later add it back, but this would be somewhat complex and I’m wondering if there is any built-in functionality to do this. My browse through the documentation turned out to be fruitless, but I could be missing something.

Answer 1

It doesn’t look like there is any built-in functionality, but there are some things you can do to make your operations easier.

I would recommend storing the cluster on the marker for easy toggling:

myClusterer = new MarkerClusterer(map, markers);

...

google.maps.event.addListener(marker, 'click', function() {
    // if marker is detached from clusterer
    if(marker.clusterer) {
        clusterer.attachMarkers([marker]);
        marker.clusterer = null;
    // if marker is attached to clusterer
    } else {
        marker.clusterer = myClusterer;
        clusterer.removeMarker(marker);
    }
});

OR event better, have the marker store the clusterer from the beginning:

myClusterer = new MarkerClusterer(map)
marker = new MyClusterableMarker();
marker.attachToClusterer(myClusterer)

...

google.maps.event.addListener(marker, 'click', function() {
    marker.toggleAttachmentToClusterer();
});

...

$.extend(MyClusterableMarker.prototype, google.maps.Marker.prototype, {

    attachToClusterer: function(clusterer) {
        this.clusterer = clusterer;
        this.clusterer.attachMarkers([this]);
        this.attachedToClusterer = true;
    },

    toggleAttachmentToClusterer: function() {
        if(this.attachedToClusterer) {
            this.clusterer.removeMarker(this);
            this.attachedToClusterer = false;
        } else {
            this.clusterer.addMarkers([this]);
            this.attachedToClusterer = true;
        }
    }
})