O'Reilly logo

Google Maps JavaScript API Cookbook by Balkan Uraz, Alper Dincer

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Adding drag zoom to the map

Google Maps has a zoom control and the JavaScript API makes use of this control to offer a variety of options for programmers. It is a very useful and easy-to-use control. But there are other ways for zooming; for instance, by drawing an area of interest by dragging a box, so that the map zooms to that area.

This functionality does not exist in the standard Google Maps JavaScript API and any of its libraries; you have to code it. Or, you can make use of the utility libraries, developed by the good guys, at the following link:

https://code.google.com/p/google-maps-utility-library-v3/wiki/Libraries

One of their libraries, KeyDragZoom, is exactly for this zoom functionality, and we will use this library in this recipe. ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required