谷歌地图缩放控制事件

Question

On this website:

http://www.crunchpanorama.com/

you use the google maps zoom control slider to zoom and recluster markers. I want to capture this event as well and perform actions accordingly.

Problem is when reading google docs, all I could find is the zoom_changed event of map. However, this event is not only called when changing zoom using slider, but also when clicking marker (which zooms into marker). So zoom_changed will not help me:

google.maps.event.addListener(map, 'zoom_changed', function () {
...

I want to be able to target the zoom change on the control slider specifically. How can I go about this?

Answer 1

Maybe there's a workaround similar to this:

var self = this;
google.maps.event.addListener(marker, 'click', function() {
    // Set a boolean variable to true to indicate a marker/cluster has been clicked
    self._markerClicked = true;
});

google.maps.event.addListener(map, 'zoom_changed', function() {
    // Check the boolean variable and run your code if it's false
    if ( !self._markerClicked ) {
        // Take action here
    } else {
        // Reset variable back to false
        self._markerClicked = false;
    }
});

Answer 2

Ran into this recently. This is the best solution I have found if you want to capture when the map default zoom buttons are clicked. This assumes that the zoom buttons are the only ones in the div map container.

$("#id-container-name").on("click", "button", whateverfunction());