我的 Web 应用程序通过 Geoserver 2.6.0 从 Postgis 向 OpenLayers 地图提供 WMS 图层，工作正常且符合预期。
用户可以通过 WMS 图层的属性（通过 HTML 中的下拉框）过滤 WMS 图层的某些元素，并且图层会按预期更新。
我现在想添加一个附加下拉框，根据附加下拉框值来更改 WMS 图层的样式。
附加下拉菜单的样式选项非常简单，要么是“正常”，要么是“突出显示”。我认为在 JavaScript 中使用简单的“if else”语句会强制以这两种样式之一绘制图层。然而不幸的是，当用户选择新样式并单击更新按钮时，样式没有更新，经过几天的努力，我完全陷入困境。
图层样式的 SLD 语法单独工作得很好（它们在 Gesoserver 界面中验证），只是不能以这种方式一起工作，只保留第一个样式。
我在类似帖子中找到的最接近的是这两个，但这些似乎并没有解决我的问题
https://gis.stackexchange.com/questions/64113/how-to-dynamically-change-sld-style-of-wms-layer-being-served-by-geoserver-from https://gis.stackexchange.com/questions/64113/how-to-dynamically-change-sld-style-of-wms-layer-being-served-by-geoserver-from
http://osgeo-org.1560.x6.nabble.com/dynamic-SLD-with-openlayers-td3806595.html http://osgeo-org.1560.x6.nabble.com/dynamic-SLD-with-openlayers-td3806595.html
有任何想法吗？
预先感谢，代码如下。
HTML 代码..
<p>Country filter:</p>
<select id="cql1">
<option value="country LIKE 'england'">england</option>
<option value="country LIKE 'wales'">wales</option>
</select>
<p>Road type filter:</p>
<select id="cql2">
<option value="road LIKE 'a-road'">main road</option>
<option value="road LIKE 'b-road'">minor road</option>
</select>
<p>Status filter:</p>
<select id="cql3">
<option value="status LIKE 'in use'">in use</option>
<option value="status LIKE 'under construction'">under construction</option>
</select>
<p>Line style:</p>
<select id="line_style">
<option value="normal">Normal</option>
<option value="highlight">Highlight</option>
</select>
<input type="submit" value="update" onclick="updateFilter(this);">
JavaScript 代码...
var roads;
// function that updates the WMS layer following user selection
function updateFilter() {
var cql1 = document.getElementById("cql1");
var cql2 = document.getElementById("cql2");
var cql3 = document.getElementById("cql3");
var line_style = document.getElementById("line_style");
var format = new OpenLayers.Format.CQL();
if (roads.params.CQL_FILTER) {
delete roads.params.CQL_FILTER;
}
var filter1;
var filter2;
var filter3;
try {
filter1 = format.read(cql1.value);
filter2 = format.read(cql2.value);
filter3 = format.read(cql3.value);
} catch (err) {
if ((cql1.value != "") || (cql2.value != "") || (cql3.value != "") || (line_style.value != "")) { //if cannot read one of the values
alert("One of the filters cannot be processed");
}
}
if ((filter1) || (filter2) || (filter3) & (line_style.value = 'normal')) {
layer.clearGrid(); // This gets rid of the previous WMS display...
layer.mergeNewParams({
'STYLES': "layer_normal",
'CQL_FILTER': cql1.value + " AND " + cql2.value + " AND " + cql3.value
})
} else {
layer.clearGrid(); // This gets rid of the previous WMS display...
layer.mergeNewParams({
'STYLES': "layer_highlight",
'CQL_FILTER': cql1.value + " AND " + cql2.value + " AND " + cql3.value
})
}
layer.redraw({
force: true
});
return false;
}
// Details of the WMS layer itself
roads = new OpenLayers.Layer.WMS(
"Filter Selection",
"http://www.example.com/geoserver/roads/wms", {
LAYERS: 'data:roads',
format: 'image/png',
srs: 'ESPG:3857',
transparent: true
}, {
transitionEffect: null,
buffer: 1,
visibility: true,
isBaseLayer: false
}
);
我最终设法解决了它 - 结果证明是我的“if”语句的问题，因为它只需要简化。
相关（工作）javascript如下...
if (line_style.value == "normal") {
layer.clearGrid(); // This gets rid of the previous WMS display...
layer.mergeNewParams({
'STYLES': "layer_normal",
'CQL_FILTER':cql1.value+" AND "+cql2.value+" AND "+cql3.value+" AND "+cql4.value
})
}
else {
layer.clearGrid(); // This gets rid of the previous WMS display...
layer.mergeNewParams({
'STYLES': "layer_highlight",
'CQL_FILTER':cql1.value+" AND "+cql2.value+" AND "+cql3.value+" AND "+cql4.value
})
}
layer.redraw({force:true});
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
