You may have noticed that while the maps in the previous section can be panned by dragging, none of the other Google Map controls are visible. There are actually several different control sets available, and GMapEZ allows access to any of them.

Big map controls

To add controls, specify their names after GMapEZ like this:

<div class="GMapEZ GLargeMapControl GMapTypeControl GScaleControl GOverviewMapControl"
    style="width: 300px; height: 350px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;hl=en">
  </a>
</div>

Here you can see the GLargeMapControl in the upper-left of the map, the GMapTypeControl in the upper-right, the GScaleControl indicating the current scale in the lower-left, and the GOverviewMapControl mini-map in the lower-right of the map.

Small map controls

Here's an example of the GSmallMapControl. You can see in the upper-left corner of this map that it has both pan and zoom controls, but no "recenter" button. It's missing the tall zoom slider, so the user can only zoom in and out one level at a time.

<div class="GMapEZ GSmallMapControl"
    style="width: 300px; height: 300px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;hl=en">
  </a>
</div>

Mini map controls

The GSmallZoomControl is the smallest, and therefore the cutest, zoom control. It has no pan controls at all. This example also sports the GSmallMapTypeControl in the upper-right corner.

<div class="GMapEZ GSmallZoomControl GSmallMapTypeControl"
    style="width: 300px; height: 300px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;hl=en">
  </a>
</div>

Continue the documentation with Info Windows.

n01se blog - Chouser's Home Page

Copyright 2012 by Chouser, all rights reserved.