Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

markerclusterer mouseover doesn't work

I just looked at the following post: markerclusterer info windows

There's a thing I need in this post, the mouseover event for the markerclusterer. I need to change the icon when the mouse is hovered over the icon.

I got the following code:

var clusterOptions = {
    zoomOnClick: false,
    styles: [{
        url: 'images/template/cluster.png',
        height: 68, 
        width: 57,
        textColor: '#FFF'
    }]
}
var markerClusterer = new MarkerClusterer(map, markers, clusterOptions);

google.maps.event.addListener(markerClusterer, "mouseover", function(cluster) {
    console.log('test');
});

// Listen for a cluster to be clicked
google.maps.event.addListener(markerClusterer, 'clusterclick', function(cluster) {

    var markers = cluster.getMarkers();
    var content = '';
    $.each(markers, function () {
        content += this.get('content');
    });

    // Convert lat/long from cluster object to a usable MVCObject
    var info = new google.maps.MVCObject;
    info.set('position', cluster.center_);

    var infowindow = new google.maps.InfoWindow();
    infowindow.close();
    infowindow.setContent(content);
    infowindow.open(map, info);

});

The clusterer works fine and also the infowindow shows up nice. It combines all the infowindows from the markers in the cluster.

What am I doing wrong in the mouseover event? I don't even see the console.log!

Thanks in advance

like image 880
Jacob Francke Avatar asked Dec 02 '25 14:12

Jacob Francke


1 Answers

My solution was using markerclustererplus rather than markerclusterer. Just replace your script src. Here is an example.


Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!