One Week of Google Maps – Part 2

This is Part 2 of a week long series featuring code for the Google Maps API.

Auto-Scaling Maps A smart feature, for those displaying markers on a Google Map, is to make sure that all points that you’re rendering are being displayed. There are a couple tactics that can be used to acheive this: 1) Keep the map zoomed out far enough such that all the points will be viewable (if you know where all the points are going to be, roughly) OR 2) Auto-zoom the map in to snugly fit all the markers.

#2 is the smartest technique, but it’s not offered by the Google Maps API. However, in the course of writing a Google Maps hack for the guys at EVDO Coverage I developed a smart algorithm to do so. In a nutshell: You pass this function the map object and an array of points that you want to be shown. The map will automatically be re-centered and zoomed in to the optimal viewing position (the closest you can get without hiding any points).

I’ve set up a demo to run here.

On the demo page, there is a simple button that, once clicked, will display 10 randomly-chosen points and apply the Auto-Scaling function to them. The Auto-Scaling code can be downloaded here. The code simply provides a function which takes a map object and an array of points (as demonstrated in the above demo). Feel free to make good use of this code!

Posted: August 13th, 2005

Subscribe for email updates

12 Comments (Show Comments)

Comments are closed.
Comments are automatically turned off two weeks after the original post. If you have a question concerning the content of this post, please feel free to contact me.

Secrets of the JavaScript Ninja

Secrets of the JS Ninja

Secret techniques of top JavaScript programmers. Published by Manning.

John Resig Twitter Updates

@jeresig / Mastodon

Infrequent, short, updates and links.