There is a lot applications that you can implement using events on the map.
In this article we'll show you how to use map "click" event and getDevInfo() API function to achieve zoom-in on click effect anywhere on the map.
Here's a code the we will add to our regular map code:
map.addListener("click", function (event) {
var info = map.getDevInfo();
map.zoomToLongLat( map.zoomLevel() * 1.2, info.longitude, info.latitude );
});
As you can see it adds a listener to "click" event. It then requests mouse position info using map.getDevInfo() which among other information contains current mouse cursor's latitude and longitude parameters.
We further use it to instruct zoomToLongLat() function which coordinates to zoom to. We also use map.zoomLevel() to get current zoom level and multiply it by 1.2 to get a nice 20% zoom-in on each click.
As usually, here's a working demo:
Comments