zoom level limit - a max zoom out

5,349 views
Skip to first unread message

Christopher Watson

unread,
Dec 12, 2010, 4:25:32 PM12/12/10
to google-map...@googlegroups.com
cant find anything in documentation about this.

i am using a custom ground overlay with my own image: http://visualisationmagazine.com/sheffieldcreativemap.htm

i have posted about it been zoomed out already as i want to var kmlLayerOptions = {map:map, preserveViewport:true};
which isnt quite working.

but, what i want here is, when i am just zoomed in at my set level of 13 in var myOptions, can i limit them to NOT zooming out further say to a wider area level 12?

i don't want to draw more of the area in my overlay image and spend ages trying geoLatLon align them all over again.

the user can move i guess in case markers are out of the target area but NOT zoom out.

this would really help the styling for the user.

cheers

chris

Esa

unread,
Dec 12, 2010, 5:22:41 PM12/12/10
to Google Maps JavaScript API v3
You can limit zoom levels by setting minZoom and maxZoom properties of
each MapType.

map.mapTypes.roadmap.minZoom = 12;

Christopher Watson

unread,
Dec 12, 2010, 5:46:43 PM12/12/10
to google-map...@googlegroups.com
hi esa

thanks for replying. i have given it a number of variations but i'm unable to implement your code. am i ok to place it in my code like this:

  function initialize() {
    var myLatLng = new google.maps.LatLng(53.382509, -1.461525);
    var myOptions = {
      zoom: 13,
      center: myLatLng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
     
      map.mapTypes.roadmap.minZoom = 12;
     
    };

putting it inside the map options. does it conflict with the zoom: 13, ?

it doesnt even load the map when i place it here, so i havent put it online.

sorry for my naivety in implementing your property suggestion, but where does it belong?

i searched this: http://code.google.com/apis/maps/documentation/javascript/maptypes.html#MapTypeInterface

but cant see where to implement/insert the code.

any further help would be very appreciated.

cheers

chris

Esa

unread,
Dec 12, 2010, 6:35:31 PM12/12/10
to Google Maps JavaScript API v3
Don't put in in map options. Put it after the line

var map = new
google.maps.Map(document.getElementById("map_canvas"), myOptions);

Christopher Watson

unread,
Dec 12, 2010, 7:14:47 PM12/12/10
to google-map...@googlegroups.com
hi esa,

i am sorry to be unable to implement (note... i noticed it said advanced on map types section for customs) but i cant figure out how to drop this code in.

  function initialize() {
    var myLatLng = new google.maps.LatLng(53.382509, -1.461525);
    var myOptions = {
      zoom: 13,
      center: myLatLng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
      mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId. MY_MAPTYPE_ID]
  },
  mapTypeId: MY_MAPTYPE_ID
};



    var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);

var myMapType = new MyMapType();
map.mapTypes.roadmap.minZoom = 12;


i know this is wrong because i cant quite follow the chain of what is being id and then called following this: http://code.google.com/apis/maps/documentation/javascript/maptypes.html

what is wrong with this code and would you be able paste and example?

again sorry. feel like its obvious and i just am not seeing it.

chris

Chris Watson

Designer, Teacher, Editor

Visual Thinking Enthusiast

visualisationmagazine.com

 

Thanks to sponsors: www.iqmatrix.com 

My profiles: Facebook LinkedIn Twitter
visualthinkmapblog: Handmade Visualisation Contest
Twitter Latest tweet: GOOGLE MAPS API v3 help needed! how can a kml, georssLayer overlay in front of a ground image overlay & preserve the ground image viewpoint?
  Get this email app!  



--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.


Esa

unread,
Dec 12, 2010, 8:14:03 PM12/12/10
to Google Maps JavaScript API v3
You can just add that line to the example you linked. I don't follow
the modifications you just posted.

Christopher Watson

unread,
Dec 12, 2010, 8:40:27 PM12/12/10
to google-map...@googlegroups.com

How could I use the line to a map esa? I'm Struggling to try and implement it.

On 13 Dec 2010 01:14, "Esa" <esa.i...@gmail.com> wrote:

You can just add that line to the example you linked. I don't follow
the modifications you just posted.


--

You received this message because you are subscribed to the Google Groups "Google Maps JavaScript AP...

Esa

unread,
Dec 12, 2010, 9:59:12 PM12/12/10
to Google Maps JavaScript API v3
Just put it here:


var map = new
google.maps.Map(document.getElementById("map_canvas"),
myOptions);
map.mapTypes.roadmap.minZoom = 12; // here
var georssLayer = new google.maps.KmlLa...

Christopher Watson

unread,
Dec 13, 2010, 2:42:23 PM12/13/10
to google-map...@googlegroups.com
hey esa,

i put it there to begin which is why i put all the other code there to make it work. doenst max the zoom out at 12 i can zoom out further, and it stops my

var srcImage = 'sheffieldmapterrain.jpg';

from loading.

here is the link to it http://visualisationmagazine.com/sheffieldcreativemapzoom.htm

Esa

unread,
Dec 13, 2010, 8:04:49 PM12/13/10
to Google Maps JavaScript API v3
Sorry. map.mapTypes seems to be timing critical. In this context it is
not available at the time when the code tries access it.

The line should be included in a suitable event handler.

Christopher Watson

unread,
Dec 13, 2010, 8:42:11 PM12/13/10
to google-map...@googlegroups.com

Thx esa, I'll have to put it on,the back burner. Not too sure about or how to write an event handler.

Need to figure out how to get kml markers above image overlay http:/www.visualisationmagazine.com/Sheffieldcreativemap.htm

Thx for the help esa


--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScri...

geoco...@gmail.com

unread,
Dec 13, 2010, 9:50:46 PM12/13/10
to Google Maps JavaScript API v3
On Dec 13, 5:42 pm, Christopher Watson <chris.watso...@googlemail.com>
wrote:
> Thx esa, I'll have to put it on,the back burner. Not too sure about or how
> to write an event handler.
>
> Need to figure out how to get kml markers above image overlay http:/www.visualisationmagazine.com/Sheffieldcreativemap.htm

If you put them on there as normal markers, they appear above the
overlay:
http://www.geocodezip.com/geoxml3_test/sheffieldcreativemapzoomB.html
(I see there is a problem with the icons you are using with geoxml3,
they are "floating", but that will be fixed)

-- Larry


>
> Thx for the help esa
>
Message has been deleted

Christopher Watson

unread,
Dec 17, 2010, 5:55:04 PM12/17/10
to google-map...@googlegroups.com
        var zoomLevel;
  google.maps.event.addListener(map, 'zoom_changed', function() {
    zoomLevel = map.getZoom();
    if (zoomLevel == 12) {
      map.mapTypes.roadmap.maxZoom(12);
    }     
  });

this stops ONE click when try to zoom out. but then lets the second click zoom out.

can i stop it from zooming out at all? more if (...)?

http://visualisationmagazine.com/sheffieldcreativemap.htm

Martin

unread,
Dec 18, 2010, 2:02:44 AM12/18/10
to Google Maps JavaScript API v3
Hi.

I think you have two options:

As already suggested, set the maxZoom property of the MapTypes.
You need do this only once - not on each zoom_changed event.

Or listen for the zoom_changed event and if the map's new zoom level
is greater than you desire then set it to your desired level:

google.maps.event.addListener(map, 'zoom_changed', function() {
var zoomLevel = map.getZoom();
if (zoomLevel >= 12) {
map.setZoom(12);
}
});

If you want to stick with the first option then you need to listen for
an event that'll indicate that the MapType is initialised and ready to
have it's maxZoom property set.

The projection_changed event MIGHT be what you need:

google.maps.event.addListenerOnce(map, 'projection_changed', function()
{
var myMapTypes=['roadmap', 'satellite', 'hybrid', 'terrain'],
i=myMapTypes.length;
while(i--){
map.mapTypes[myMapType[i]].maxZoom=12;
}
});

That projection_changed event listener is untested code btw, and i'm
not sure if the maxZoom property of each map type is available after
that event is triggered - you'll have to experiment!

Martin.


On Dec 17, 10:55 pm, Christopher Watson

Christopher Watson

unread,
Dec 20, 2010, 7:10:17 PM12/20/10
to google-map...@googlegroups.com
thanks martin will have a play. see what works.

visualthinkmapblog: Facebook Cartography


--
Reply all
Reply to author
Forward
0 new messages