jquerygoogle-mapsjquery-gmap3

how to get gmap3 to zoom


I'm using GMAP3 to generate a map. The following code works well, but as soon as I remove <,"autofit"> from the script, the map doesn't work. I'm doing this because when I use maxZoom, it doesn't allow me to zoom in via the map tools.

jQuery(document).ready(function() 
{
 $('#location-map').gmap3({
 map: {
  options: {
    zoom:4,
    maxZoom: 6
  } 
},
marker:{
  address: "1600 Pennsylvania Ave, Washington DC",
  options: {
   icon: new google.maps.MarkerImage(
     "http://www.somesite.com/images/pin_blue.png",
     new google.maps.Size(32, 37, "px", "px")
   )
  }

}
},"autofit");
});

I read through the gmap documentation and googled and can't find anything but this other problem: Setting a max zoom level using jquery gmap3 & autoFit

Though it seems that adding an additional radius might not be the correct way to fix this.

Thanks!


Solution

  • remove the autofit-option(I guess "doesn't work" should mean that the map is not centered at the marker-location) and use the callback-function of the marker to set the center:

    marker:{
      address: "1600 Pennsylvania Ave, Washington DC",
      options: {
       icon: new google.maps.MarkerImage(
         "http://www.somesite.com/images/pin_blue.png",
         new google.maps.Size(32, 37, "px", "px")
       )
      },
      callback:function(m){
        m.getMap().panTo(m.getPosition());
      }
    }