Different level of detail(layers) on different zoom level at OpenLayers map

Question

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

Answer 1

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

eventListeners

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

EVENT_TYPES

{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",
        "http://vmap0.tiles.osgeo.org/wms/vmap0",
        {layers: 'basic'}, {'displayInLayerSwitcher':false} );

var layer2 = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
    "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
    {layers: "landsat7"}, {'isBaseLayer': false});

var layer3 = new OpenLayers.Layer.WMS( "DM Solutions Demo",
    "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
    {layers: "bathymetry,land_fn,park,drain_fn,drainage," +
             "prov_bound,fedlimit,rail,road,popplace",
     transparent: "true", format: "image/png" });


layer2.setVisibility(false);
layer3.setVisibility(false);

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

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

        if( zLevel == 13 || zLevel == 14 || zLevel == 15  )
        {
            layer2.setVisibility(true);
        }
        if( zLevel == 16 || zLevel == 17 || zLevel == 18)
        {
            layer2.setVisibility(false);
            layer3.setVisibility(true);
        }

    });

i hope it helps you...

Answer 2

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.

Answer 3

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

Answer 4

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