I want display different detail(layers) on different zoom level on OpenLayers map. I mean when zoom in should display lot of layers and when zoom out those unsuitable layers should hide automatically. Different layers should display on different zoom level ,not using layer switcher.

Can this do using OpenLayers?

If not what is the open source solution? If yes, pls give some example or links to get some idea

Thanks for reading and answering

  • 1
    pls dont write OpenLayers as open layer, it leads to concept confusion...
    – urcm
    Commented May 8, 2012 at 11:26
  • Ohh,Really sorry,I don't do that again Commented May 8, 2012 at 11:49

4 Answers 4


you can do this with some programmatic way as registering map with zoomend :


{Object} If set as an option at construction, the eventListeners object will be registered with .


{Array(String)} Supported application event types. Register a listener for a particular event with the following syntax:

map.events.register(type, obj, listener);

Listeners will be called with a reference to an event object. The properties of this event depends on exactly what happened.

Solution Code:

var layer1 = new OpenLayers.Layer.WMS( "OpenLayers WMS",
        {layers: 'basic'}, {'displayInLayerSwitcher':false} );

var layer2 = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
    {layers: "landsat7"}, {'isBaseLayer': false});

var layer3 = new OpenLayers.Layer.WMS( "DM Solutions Demo",
    {layers: "bathymetry,land_fn,park,drain_fn,drainage," +
     transparent: "true", format: "image/png" });


map.addLayers([layer1, layer2, layer3]);

map.events.register('zoomend', this, function (event) {
        var zLevel = map.getZoom();     

        if( zLevel == 13 || zLevel == 14 || zLevel == 15  )
        if( zLevel == 16 || zLevel == 17 || zLevel == 18)


i hope it helps you...


Using layer "scales" property you can control which zoom levels are valid for the layer. The link sugested by sacprasanna is the best place to learn all this.


Although Aragons answer is good, max and minResolution properties of the OpenLayers.Vector (which the WMS layer inherits): http://dev.openlayers.org/releases/OpenLayers-2.11/doc/apidocs/files/OpenLayers/Layer-js.html#OpenLayers.Layer.maxResolution

Set appropriate min and max scales at initialization, and you should get the same behavoiur as in Aragons example.

The only drawback is that you have to care about resulutions instead of zoom levels

  • 1
    @Aragon s answer seems to be more flexible and intuitive. It's deserves an accepted.
    – Magno C
    Commented Dec 19, 2012 at 10:39
  • why not use both? layer.addOptions({maxResolution:map.getResolutionForZoom(8)});
    – pstanton
    Commented Jul 10, 2017 at 0:28

You can set the maxResolution attribute on individual layers, per the documentation. "The maximum resolution (exclusive) below which this layer will be visible."

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.