Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Setting a max zoom level using jquery gmap3 & autoFit

I am using 'autoFit' on the gmap3 plugin so it zooms to the best level for the objects on the map. The problem is when there is only 1 object it zooms in to the maximum level which is too far. How can i make it go no futher than zoom level 14?

Thanks.

like image 415
472084 Avatar asked Dec 09 '22 06:12

472084


2 Answers

You can use maxZoom, but that sets the max zoom of the map and not of the autofit function. That means that the user will not be able to zoom further in on the map if they would want to.

map:{
      center: true,
      zoom: 10,
      maxZoom: 18
    }

Instead I added a hidden circle or radius to every point with a size that would make the map zoom out to the zoom level I would want it to be. This way the user can still zoom further in if they would want to.

$('#test').gmap3(
    { 
        action: 'addMarker',
        latLng: "your data input for markers",
        map:{
            center: true,
            zoom: 10
        }
    },
    { 
        action: 'addCircle',
        latLng: "your data input for markers",
        options: {
            radius : 75,
            strokeOpacity: 0,
            fillOpacity: 0,
        }
    },
    'autofit'
);
like image 120
Christoffer Avatar answered Jan 23 '23 01:01

Christoffer


You can add the maxzoom property to the map property of the gmap3 plugin:

$('#test1').gmap3(
      {
        action: 'addInfoWindow',
        address: "some place name",
        map:{
          center: true,
          zoom: 5,
          maxZoom: 10
        },...
like image 43
Ali Habibzadeh Avatar answered Jan 22 '23 23:01

Ali Habibzadeh