I'm working on a proyect with openlayers and geoserver, the idea is to have a select menu where the user can choose which layer is visible, something like this
<select id="format">
<option value="rios_dobles">Rios Dobles </option>
<option value="rios_simples">Rios Simples</option>
<option value="lagos_lagunas">Lagos Lagunas</option>
<option value="vias">Vias</option>
<option value="limite_parroquial" selected>Limite Parroquial</option>
<option value="basicos">Basicos</option>
<option value="Centros_Poblados">Centros Poblados</option>
<option value="Aptitud_final">Aptitud Final</option>
<option value="uso_final">Uso Final</option>
</select>
The layers are set like this
var limites = new ol.layer.Image({
source: new ol.source.ImageWMS({
ratio: 1,
url: 'http://localhost:8080/geoserver/gis2017/wms',
params: {'FORMAT': format,
'VERSION': '1.1.1',
STYLES: '',
LAYERS: 'gis2017:limite_parroquial',
}
})
});
And are displayed on the map like this
var map = new ol.Map({
controls: ol.control.defaults({
attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
collapsible: false
})
}).extend([mousePositionControl]).extend([scaleLineControl]),
interactions: ol.interaction.defaults().extend([
new ol.interaction.DragRotateAndZoom()
]),
target: 'map',
layers: [
limites,
//lagos,
//vias,
//riosDobles,
aptitud,
//centros,
//riosSimples,
uso,
],
view: new ol.View({
projection: projection
}),
});
At least as a test I've seen if I can make the layer limites visible or not, but it won't work, I've tried using the methots setVisible and setVisibility but regarldess of weather or not I put true or false, the layer won't display (or any other for that matter)
I don't know what to change or do, I'm completely stuck.
Best Answer
You need to address 3 things:
Assign a name to each layer
You need to identify your layers to know which layer you want to make visible or invisible.
For each layer, add a
name
property to it, like:Comboxbox option values
On the combobox, for each option, the value must be equal to the layer name, like:
Listener to change visibility
If you have assigned names to the layers and the combox have values equals to the layer names, you can write a small fuction to handle the visibility, like:
Geoserver transparent option
Since you are using Geoserver, you may need to add the
transparent
option to your layer requests, like: