openlayers 2 - How to disable overlay check box after a certain zoom level?

How do I disable a particular overlay checkbox in the Openlayers Layerswitcher?

Answer

There is a layer property, displayInLayerSwitcher but it makes the entire layer dissaper instead of simply disableing the checkbox.

However, there are always work arounds:

You can work that functionality into the layer class prototype like so:

OpenLayers.Layer.prototype.disableInSwitcher = function (disable) {

    if (disable) {

        if (!this.disabledInSwitcher) {
            var lSwitcher = this.map.getControlsByClass("OpenLayers.Control.LayerSwitcher")[0];

            for (var i in lSwitcher.dataLayers) {
                if (lSwitcher.dataLayers[i].layer.name == this.name) {
                    var attr = document.createAttribute("disabled");

                    attr.value = "disabled";
                    lSwitcher.dataLayers[i].inputElem.attributes.setNamedItem(attr);
                }
            }
            this.disabledInSwitcher = true;
        }
    } else {

        if (this.disabledInSwitcher) {
            var lSwitcher = this.map.getControlsByClass("OpenLayers.Control.LayerSwitcher")[0];


            for (var i in lSwitcher.dataLayers) {
                if (lSwitcher.dataLayers[i].layer.name == this.name) {
                    lSwitcher.dataLayers[i].inputElem.attributes.removeNamedItem("disabled");
                    console.log("here");
                }
            }
            this.disabledInSwitcher = false;
        }
    }

};

Then register the zoomend event like so:

map.events.register('zoomend', map, handleZoom);

And handle that event:

var handleZoom = function (event) {

    if (map.getZoom() > 2) {
        myFirstLayer.disableInSwitcher(true);

        mySecondLayer.disableInSwitcher(false);
    } else {
        myFirstLayer.disableInSwitcher(false);
        mySecondLayer.disableInSwitcher(true);
    }
}