OverlaySwitcher scroll bar

[Chad5]

I’ve noticed that if the overlay switcher map tool has many overlays that they could “fall out” or “cut off” at the bottom if the map height isn’t big enough.  I’ve used temporary fixes for now (i.e. font-size and padding) but I would like it if the overlay switcher had a scroll bar.  I’ve tried including overflow: auto; to the theme/default/site.css file but on the page, the scroll bar shows up but is not activated.  As if it doesn’t know how many overlays are in the switcher.  Any ideas on how to add a scroll bar to the switcher?

[Troy]

Hi Chad,



I did some tests and got two ways, one is adding the overflow property for integrated layer switcher control and the other one is put the layer switcher into an new div.



First solution:

    .olControlLayerSwitcher {
    position: absolute;
    top: 25px;
    right: 0;
    width: 20em;
    font-family: sans-serif;
    font-weight: bold;
    margin-top: 3px;
    margin-left: 3px;
    margin-bottom: 3px;
    font-size: smaller;
    color: white;
    background-color: transparent;
    overflow: auto;
}

However, even this way can make the scrollbar works fine but when I tried to minimize the switcher, the extent image is disappear, I am still working on why it happens.



The other way is using the below codes:

<script type=“text/javascript”>
    OnMapCreated = function (map) {
        var layerSwitcherControl = map.getControl(“LayerSwitcher”);
        if (layerSwitcherControl) {
            map.removeControl(layerSwitcherControl);
        }
        var newLayerSwitcherControl = new OpenLayers.Control.LayerSwitcher({ ‘div’: OpenLayers.Util.getElement(‘layerSwitcher’) });
        map.addControl(newLayerSwitcherControl);
    }
</script>

the “layerSwitcher” id represents an div out side the map and will be as a container to include the layers. However, this will make all the settings like background color from OverlaySwitcherMapTool not work as  we create a total new layer control with OL.



I will keep looking for the first solution and let you know if any progress. Please let us know if any questions.



Thanks,



Troy