Example 25 - Zoom Level Control

Have you ever wished you could limit just how far in or how far out users could zoom your map? Well now you can, simply by setting the minZoom and maxZoom attributes of your map.

This code only works for version 2 maps, so we've used (of course) the version 2 zoom numbering system. Version 2 maps have zoom levels from 0 (all the way out, where you see the whole globe on one tile) to 17 (which is their highest standard zoom level). And, by no mere coincidence, these are also the default values for minZoom (0) and maxZoom (17). You can set them to whatever you want. In this example, we've set them to a minZoom of 5 and a maxZoom of 10.

You may (or may not) have noticed, but the zoom slider bar size has also changed and now your new maxZoom is reflected as "all the way in". Oddly enough, it does not change the slider to set your minZoom as "all the way out", instead leaving that as "0", even though it won't let you actually zoom out that far (because we've limited it to 5). Who knows...

Here's the code we used:

<googlemaps:map id="map" width="780" height="300" version="2" type="STREET"
	minZoom="5" maxZoom="10">
  	<googlemaps:key domain="www.lamatek.com" key="xxxxx"/>
  	<googlemaps:point id="point1" address="74 Connors Lane" city="Elkton" state="MD" 
  		zipcode="21921" country="US"/>
  	<googlemaps:point id="point2" address="1226 Forest Parkway" city="West Deptford" 
  		state="NJ" zipcode="08066" country="US"/>
  	<googlemaps:marker id="marker1" point="point1"/>
	<googlemaps:marker id="marker2" point="point2"/>
  	<googlemaps:typeControl enable="true"/>
	<googlemaps:zoomControl enable="true" size="large"/>
  	<googlemaps:scaleControl enable="true"/>
  	<googlemaps:panControl enable="true"/>
  	<googlemaps:overviewControl height="200" width="200" x="605" y="279"/>
</googlemaps:map>  
  

Zoom level restriction only works on version 2 maps.

Our next example demonstrates how to limit custom map movements.