嗨,这是我的代码我想添加一个后端层osm和平铺和未经处理的wms图层,外部sld文件从geoserver中获取样式。请指正。单击时的样式不会随着添加后端osm层的用户选择而改变。所以我想要在wms图层上改变样式的osm图层。
layer:
<script>
var untiled = new ol.layer.Image({
source: new ol.source.ImageWMS({
ratio: 1,
url: 'http://localhost:8080/geoserver/wg/wms',
params: {'FORMAT': format,
'VERSION': '1.1.1',
STYLES: '',
LAYERS: 'wg:UKNEWPANESR2015',
}
})
});
var tiled = new ol.layer.Tile({
visible: false,
source: new ol.source.TileWMS({
url: 'http://localhost:8080/geoserver/wg/wms',
params: {'FORMAT': format,
'VERSION': '1.1.1',
tiled: true,
STYLES: '',
LAYERS: 'wg:UKNEWPANESR2015',
}
})
});
//Openstreetmap layer
var osm = new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'osm'})
});
osm.set('name', 'OSM');
var map = new ol.Map({
controls: ol.control.defaults({
attribution: false
}).extend([mousePositionControl]),
target: 'map',
layers: [ osm,
untiled,
tiled
]
});
//Function to call styles
function setStyle(style){
map.getLayers().forEach(function(lyr) {
lyr.getSource().updateParams({'STYLES': style});
});
}
<script>
<body>
<div id="toolbar" style="display: none;">
<ul><li>
<a>Styles:</a>
<select id="imageFormatSelector" onchange="setStyle(value)">
<option value="">Default</option>
<option value="BIOMASSGG-WEI">BIOMASSGG-WEI</option>
<option value="AGRO-WEIGHT">AGRO-WEIGHT</option>
<option value="BIOMASSGG">BIOMASSGG</option>
<option value="BIOENERGYSD">BIOENERGYSD</option>
<option value="BIOENERGYSD-WEIsld">BIOENERGYSD- WEIsld</option>
<option value="AGROCLIMATICZONE">AGROCLIMATICZONE</option>
</select>
</li>
</ul>
</body>