This is a static archive of our old OpenStreetMap Help Site. Please post any new questions and answers at community.osm.org.

OpenLayers - limit the number of zoom levels

Hello,

I'm trying to limit the zoom levels of my OpenLayers application. I want to make max zoom level to be 14 using standard zoom levels (nothing fancy like fractional zooms and resolutions) and that is all. I've read this article: http://trac.osgeo.org/openlayers/wiki/SettingZoomLevels I've tried tons of combinations of maxExtent, minExtent, maxResolution, minResolution, numZoomLevels and so on... the user is always able to go beyond ZL 14 :(

Here is my map definition:

var options = {
        projection: new OpenLayers.Projection("EPSG:900913"),
        units: "m",
        controls: [
            new OpenLayers.Control.PanZoomBar(),
            new OpenLayers.Control.LayerSwitcher(),
            new OpenLayers.Control.Permalink(),
            new OpenLayers.Control.Attribution(),
            new OpenLayers.Control.Navigation(),
            new OpenLayers.Control.ScaleLine()
        ],
        displayProjection: new OpenLayers.Projection("EPSG:4326")
    }
    map = new OpenLayers.Map("mapdiv",options);
    map.addLayer(new OpenLayers.Layer.OSM());

openlayers zoom

asked 20 Jun '12, 18:52

ivanatora
2.7k●35●55●68
accept rate: 7%

retagged 21 Jun '12, 23:18

ikonor
1.3k●2●11●19

3 Answers:

For tile based layers you can set zoomOffset and resolutions. See Wiki Restricting the bounds & zoom levels and example Isle of Wight Paths. Setting maxResolution and numZoomLevels along with serverResolutions should also work, see Bing Tiles with a Subset of Resolutions Example.

For convenience, I use the serverResolutions array defined in the Bing layer, which corresponds to OSM resolutions (apart from extending to level 21):

var resolutions = OpenLayers.Layer.Bing.prototype.serverResolutions.slice(14, 19);
map.addLayer(new OpenLayers.Layer.OSM(null, null, {zoomOffset: 14, resolutions: resolutions}));

// zoom level relative to zoomOffset
map.setCenter(new OpenLayers.LonLat(-0.1265, 51.5034).transform(
   new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()), 0);

answered 21 Jun '12, 23:16

ikonor
1.3k●2●11●19
accept rate: 18%

I'd register an event on movestart (which includes zooming) and prevent zooming if the map's zoomlevel is higher than a certain value

function handleZoom(event) {
    var map = event.object;
    if (map.getZoom() > 14) {
       event.stop(event);
    }
}
var map = new OpenLayers.Map();¨
map.events.register('zoomstart', map, handleZoom)

I didn't test this, so you propably need to enhance the event handling function

answered 21 Jun '12, 09:07

frabron
361●1●4●11
accept rate: 16%

Okay, the first issue was that the event name is 'movestart', not 'zoomstart'. I've changed that and the handler is firing, but I can't stop the event propagation. I keep getting event.stop is not a function. I tried OpenLayers.Event.stop(e) but that seems to do nothing at all. How to get the event from the handler function? The callback argument seem to contain 2 properties - dom element and object (that is not OpenLayers.Event object) and that is all.

(26 Jun '12, 14:49) ivanatora

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

  function zoomChanged()
    {
        var coor_from = new OpenLayers.Projection("EPSG:4326");
        var coor_to   = new OpenLayers.Projection("EPSG:900913");
        var level = map.getZoom();
        var center =   map.getCenter()
        center.transform(coor_to,coor_from);
        var zoomLevel = level;
        var valid =false;
        map.getNumZoomLevels = function(){ return 16; };
        map.isValidZoomLevel = function(zoomLevel) {
            valid = ( (zoomLevel != null) &&
            (zoomLevel >= minzoom) &&
            (zoomLevel <= maxzoom) );
            console.log(valid);
            console.log(map.getZoom());
            if(!valid && map.getZoom() == 0){
                map.zoomTo(maxzoom - (maxzoom - minzoom)/2);

            }
            return valid;
        }
        if(valid)
        {
            SetCenterPoint(center.lat, center.lon, map.getZoom());
        }
        return valid;
    }

answered 09 Jun '16, 11:48

Vijay Rajbhar
1
accept rate: 0%