David Pfeffer
David Pfeffer

Reputation: 39833

Min/max zoom level in OpenLayers

I'm using OpenLayers to display a map in a web page. I am using tiles from CloudMade, but the same issues occur with the Mapnik tiles from OpenStreetMap.

I'm trying to restrict the map so that the user cannot zoom all the way out to world view -- I want them to stay at roughly a city level zoom at minimum.

I have tried using the minZoomLevel / maxZoomLevel / numZoomLevels properties; only the maxZoomLevel and numZoomLevels properties seem to work, whereas the minZoomLevel property seems to be completely ignored.

Is there another way to accomplish this?

Upvotes: 22

Views: 31009

Answers (9)

Jonathan
Jonathan

Reputation: 5993

You could override the isValidZoomLevel function. Something like this (not tested):

OpenLayers.Map.isValidZoomLevel = function(zoomLevel) {
   return ( (zoomLevel != null) &&
      (zoomLevel >= 2) && // set min level here, could read from property
      (zoomLevel < this.getNumZoomLevels()) );
}

EDIT

Or you would need to override the available resolutions, see the example here: http://dev.openlayers.org/examples/zoomLevels.html

Upvotes: 11

Fernando Sanchiz
Fernando Sanchiz

Reputation: 278

Now i use this in the "View":

view: new ol.View({
    center: ol.proj.transform([-3.707524, 40.485644], 'EPSG:4326',EPSG:3857'),
    zoom: 15,
    maxZoom: 17,
    minZoom: 6
}),

And it works fine

Upvotes: 1

jjmontes
jjmontes

Reputation: 26875

Other answers here refer to OpenLayers versions prior to version 3.

With OpenLayers 3, you can use the maxZoom map option when initializing the map, as follows:

    var map = new ol.Map({
        target: 'mapcontainer-001',
        layers: layers,  // Layers need to be initialized previously
        view: new ol.View({
          center: ol.proj.transform([-5.12345, 42.12345], 'EPSG:4326', 'EPSG:3857'),
          zoom: 12,
          maxZoom: 19
        })
    });

More information can be found in OpenLayers documentation: http://openlayers.org/en/v3.0.0/doc/tutorials/concepts.html

Upvotes: 2

nachtigall
nachtigall

Reputation: 2497

The best answer I found (including an example) was at OpenLayers - limit the number of zoom levels. I don't paste it here, please see the instructions over there.

Upvotes: 0

Akna
Akna

Reputation: 139

I tried something like this and it works for me:

map.newMoveTo = map.moveTo;
map.moveTo = function(lonlat,zoom,options){
    return(zoom>=maxZoom && zoom<=minZoom)?map.newMoveTo(lonlat,zoom,options):false;
};

Upvotes: 0

netbrain
netbrain

Reputation: 9304

I ended up with this solution as i could not figure out how to use zoomOffset in my setup.

        map.getNumZoomLevels = function(){
            return (options.maxzoom-options.minzoom+1);
        };

        map.isValidZoomLevel = function(zoomLevel) {
            var valid = ( (zoomLevel != null) &&
                (zoomLevel >= options.minzoom) &&
                (zoomLevel <= options.maxzoom) );
            if(!valid && map.getZoom() == 0){
                map.zoomTo(options.maxzoom - (options.maxzoom - options.minzoom)/2);

            }
            return valid;
        }

Upvotes: 0

Graham
Graham

Reputation: 6562

I found the simplest way to restrict the maxZoom levels for a XYZ layer was to override the getNumZoomLevels method:

map.getNumZoomLevels = function(){
        return 10;
        };

This pevents zooming beyond level 10 and also draws the zoomBar control correctly. This and a combination of the zoomOffset option should allow you to easily control min/max zoom without having to mess around with resolutions or subclasses.

Upvotes: 8

biphobe
biphobe

Reputation: 4808

Defining resolutions doesn't solve the problem (even in v2.1) - I didn't find any pernament fix for this, so I made my own zoombar in JS - that's what I would recommend to anyone who encounters issues with zoombar using custom tiles.

Upvotes: 0

geographika
geographika

Reputation: 6528

minZoomLevel is not supported for XYZ layers, of which OSM is a subclass.

See the following tickets for workarounds:

Upvotes: 9

Related Questions