CODEWITHSUNDEEP
javascriptjquerygoogle-maps
Janie
Janie

Reputation: 646

How to detect zoom in/out button is clicked on google map

In google map zoom_changed event can be called by double click, mouse while or zoom in/out button clicking. My question is how can I detect that zoom changed is occurred by zoom in/out button click ?

I have tried to catch event from function but I got it undefined

google.maps.event.addListener(MAP_PROPERTIES.map, 'zoom_changed', function(e)
{
    self.closeInfoWindow();

    if(MAP_PROPERTIES.user_interaction == true && MAP_PROPERTIES.currentZoomLevel != MAP_PROPERTIES.map.getZoom() )
    {
        VRS.TRACE(e); // e is undefined here

        /*My functionalities here*/
    }
});

Any of your suggestions will be appreciated.

Upvotes: 1

Views: 1673

Answers (1)

Rohith K P
Rohith K P

Reputation: 3551

I just found this fiddle in which there is custom zoom controls added. So you can actually add event listeners easily. http://jsfiddle.net/maunovaha/jptLfhc8/

  var zoomInButton = document.createElement('div');
  zoomInButton.style.width = '32px'; 
  zoomInButton.style.height = '32px';
  /* Change this to be the .png image you want to use */
  zoomInButton.style.backgroundImage = 'url("http://placehold.it/32/00ff00")';
  controlWrapper.appendChild(zoomInButton);

  // Setup the click event listener - zoomIn
  google.maps.event.addDomListener(zoomInButton, 'click', function() {
    map.setZoom(map.getZoom() + 1);
  });

or else try adding event listener to this $('[title="Zoom out"]')

Upvotes: 1

Related Questions