WMS OpenLayers mergeNewParams set Opacity SLD_Body
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/openlayers/2.11/OpenLayers.js"></script>
<body onload="init()">
<h1>Klick on the blue button to set some States to opacity 0.2 while Nebraska stays at opacity 1.0 </h1>
<div id="map" class="smallmap"></div>
<div id="panel"></div>
</body>
CSS
#map {
width: 400px;
height: 400px;
border: 1px solid #dddddd;
}
.Panel1 {
width: 18px;
height: 54px;
cursor: pointer;
right: 10px;
top: 10px;
}
.Panel2 {
width: 18px;
height: 54px;
cursor: pointer;
right: 10px;
top: 74px;
}
.Panel3 {
width: 18px;
height: 54px;
cursor: pointer;
right: 10px;
top: 138px;
}
.firstItemInactive, .secondItemInactive {
background: #30d5c8;
border: 2px solid #075f67;
width: 18px;
height: 18px;
}
.firstItemActive, .secondItemActive {
background: #ffffdd;
border: 2px solid #dddddd;
width: 18px;
height: 18px;
}
.olControlLayerSwitcher .layersDiv {
background-color: #ff0000;
height: 100%;
padding: 5px 75px 5px 10px;
width: 100%;
}
div.olMap {
z-index: 0;
padding: 0 !important;
margin: 0 !important;
cursor: default;
}
div.olMapViewport {
text-align: left;
-ms-touch-action: none;
}
div.olLayerDiv {
-moz-user-select: none;
-khtml-user-select: none;
}
.olLayerGoogleCopyright {
left: 2px;
bottom: 2px;
}
.olLayerGoogleV3.olLayerGoogleCopyright {
right: auto !important;
}
.olLayerGooglePoweredBy {
left: 2px;
bottom: 15px;
}
.olLayerGoogleV3.olLayerGooglePoweredBy {
bottom: 15px !important;
}
/* GMaps should not set styles on its container */
.olForeignContainer {
opacity: 1 !important;
}
.olControlAttribution {
font-size: smaller;
right: 3px;
bottom: 4.5em;
position: absolute;
display: block;
}
.olControlScale {
right: 3px;
bottom: 3em;
display: block;
position: absolute;
font-size: smaller;
}
.olControlScaleLine {
display: block;
position: absolute;
left: 10px;
bottom: 15px;
font-size: xx-small;
}
.olControlScaleLineBottom {
border: solid 2px black;
border-bottom: none;
margin-top:-2px;
text-align: center;
}
.olControlScaleLineTop {
border: solid 2px black;
border-top: none;
...
JavaScript
var map;
var layer, wms;
function init() {
map = new OpenLayers.Map('map',
{maxExtent: new OpenLayers.Bounds(-20027593.947852,-3249680.8301405,-4373290.5572275,12404622.560484)});
wms = new OpenLayers.Layer.WMS(
"OpenLayers WMS", "http://demo.opengeo.org/geoserver/wms", {
layers: 'topp:states',
transparent: 'true'
});
var osm=new OpenLayers.Layer.OSM("Fuffi");
map.addLayers([osm,wms]);
var mittelpunkt=new OpenLayers.LonLat(-98.7, 39.9).transform(new OpenLayers.Projection("EPSG:4326"),new OpenLayers.Projection("EPSG:3857"));
map.setCenter(mittelpunkt, 3);
map.addControl(new OpenLayers.Control.LayerSwitcher());
var panel_type2 = new OpenLayers.Control.Panel({
displayClass: 'Panel2'
});
map.addControl(panel_type2);
var redraw = new OpenLayers.Control.Button({
displayClass: 'first',
trigger: function () {
SLD_BODY= '<?xml version="1.0" encoding="utf-8"?>' + '<StyledLayerDescriptor version="1.0.0" xmlns="http://www.opengis.net/sld" xmlns:gml="http://www.opengis.net/gml" xmlns:ogc="http://www.opengis.net/ogc" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.opengis.net/sld http://schemas.opengeospatial.net/sld/1.0.0/StyledLayerDescriptor.xsd"><NamedLayer><Name>topp:states</Name>'+
//'<NamedStyle><Name>pophatch</Name></NamedStyle>'+
'<UserStyle><FeatureTypeStyle>'+
'<Rule><ogc:Filter><ogc:PropertyIsEqualTo><ogc:PropertyName>STATE_NAME</ogc:PropertyName><ogc:Literal>Nebraska</ogc:Literal></ogc:PropertyIsEqualTo></ogc:Filter><PolygonSymbolizer>'+
'<Fill><CssParameter name="fill">#111111</CssParameter>'+
'<CssParameter name="fill-opacity">1.0</CssParameter></Fill>'+
'<Stroke><CssParameter...