1

I have added the raster layer from GeoServer as a WMS source.

There is an HTML filter to apply changes with GeoServer Raster WMS Layer, which is not working with RasterSymbolizer, and CQL filter.

Like setFilter for a vector layer with Mapbox GL JS.

SLD:

<sld:ColorMapEntry quantity="10" label="10 min" color="#e7ecff" opacity="0.898039"/>
<sld:ColorMapEntry quantity="20" label="20 min" color="#e1f8e1"/>
<sld:ColorMapEntry quantity="30" label="30 min" color="#cff7d3"/>
<sld:ColorMapEntry quantity="40" label="40 min" color="#a9e2ae" opacity="0.941176"/>
<sld:ColorMapEntry quantity="50" label="50 min" color="#a5cba7"/>
<sld:ColorMapEntry quantity="60" label="1 hr" color="#e7d676"/>
<sld:ColorMapEntry quantity="120" label="2 hrs" color="#f2b276"/>
<sld:ColorMapEntry quantity="240" label="4 hrs" color="#e77657"/>
<sld:ColorMapEntry quantity="360" label="6 hrs" color="#be3e40"/>
<sld:ColorMapEntry quantity="720" label="12 hrs" color="#9b3234"/>
<sld:ColorMapEntry quantity="960" label="16 hrs" color="#7a2764"/>
<sld:ColorMapEntry quantity="1200" label="20 hrs" color="#531a45"/>
<sld:ColorMapEntry quantity="1400" label="> 1 day" color="#291144"/>

I have tried:

  1. CQL but I don't know the property value for the raster layer.
http://yourserder:8080/geoserver//wms?service=WMS&version=1.1.0&cql_filter=circle_n=circle name&request=GetMap&layers=rasterlayer:rasterlayer&styles=&bbox=bounding boxof your desire&width=768&height=492&srs=EPSG:4326&format=image%2Fpng&transparent=true&

  1. I have also tried a RasterSymbolizer with the env variable but it also not working.

RasterSymbolizer SLD:

<sld:ColorMap name='env'>
<sld:ColorMapEntry quantity="10" label="10 min" color="${env('10_min','#e7ecff')}" opacity="0.898039"/>
<sld:ColorMapEntry quantity="20" label="20 min" color="${env('20_min','#e1f8e1')}"/>
<sld:ColorMapEntry quantity="30" label="30 min" color="${env('30_min','#cff7d3')}"/>
<sld:ColorMapEntry quantity="40" label="40 min" color="${env('40_min','#a9e2ae')}" opacity="0.941176"/>
<sld:ColorMapEntry quantity="50" label="50 min" color="${env('50_min','#a5cba7')}"/>
<sld:ColorMapEntry quantity="60" label="1 hr" color="${env('1_hour','#e7d676')}"/>
<sld:ColorMapEntry quantity="120" label="2 hrs" color="${env('2_hour','#f2b276')}"/>
<sld:ColorMapEntry quantity="240" label="4 hrs" color="${env(4_hour), #e77657}"/>
<sld:ColorMapEntry quantity="360" label="6 hrs" color="${env('6_hour','#be3e40')}"/>
<sld:ColorMapEntry quantity="720" label="12 hrs" color="${env('12_hour','#9b3234')}"/>
<sld:ColorMapEntry quantity="960" label="16 hrs" color="${env('16_hour','#7a2764')}"/>
<sld:ColorMapEntry quantity="1200" label="20 hrs" color="${env('20_hour','#531a45')}"/>
<sld:ColorMapEntry quantity="1400" label="> 1 day" color="${env('1_day','#291144')}"/>
</sld:ColorMap>

https://localhost:8080/geoserver/wms?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&FORMAT=image%2Fpng&TRANSPARENT=true&LAYERS=geo%3Alayer_clim_w&TILED=true&WIDTH=320&HEIGHT=320&CRS=EPSG%3A3857&FORMAT_OPTIONS=dpi%3A113&BBOX=0%2C-5009377.085697312%2C5009377.085697311%2C-9.313225746154785e-10&env=10_min:%23000000;20_min:%23000000;30_min:%23000000;40_min:%23000000;50_min:%23000000

Is there any way to apply changes to the raster layer with GeoServer?

something similar.

https://stackoverflow.com/questions/44431982/how-can-i-filter-clip-a-raster-provided-by-wms-geoserver

1

Here is the answer for working cql filter for raster with a raster symbolizer solution.

note: GeoServer validation will not pass for this sld but It will work, when you save.

idea is to change the opacity to zero for slider value.

<sld:ColorMap name='env'>
<sld:ColorMapEntry quantity="10" label="10 min" color="#e7ecff" opacity="${env('value_0', 1)}"/>
<sld:ColorMapEntry quantity="20" label="20 min" color="#e1f8e1" opacity="${env('value_1',1)}"/>
<sld:ColorMapEntry quantity="30" label="30 min" color="#cff7d3" opacity="${env('value_2',1)}"/>
<sld:ColorMapEntry quantity="40" label="40 min" color="#a9e2ae" opacity="${env('value_3',0.941176)}"/>
<sld:ColorMapEntry quantity="50" label="50 min" color="#a5cba7" opacity="${env('value_4',1)}"/>
<sld:ColorMapEntry quantity="60" label="1 hr" color="#e7d676" opacity="${env('value_5',1)}"/>
<sld:ColorMapEntry quantity="120" label="2 hrs" color="#f2b276" opacity="${env('value_6',1)}"/>
<sld:ColorMapEntry quantity="240" label="4 hrs" color="#e77657}" opacity="${env('value_7',1)}"/>
<sld:ColorMapEntry quantity="360" label="6 hrs" color="#be3e40" opacity="${env('value_8',1)}"/>
<sld:ColorMapEntry quantity="720" label="12 hrs" color="#9b3234" opacity="${env('value_9',1)}"/>
<sld:ColorMapEntry quantity="960" label="16 hrs" color="#7a2764" opacity="${env('value_10',1)}"/>
<sld:ColorMapEntry quantity="1200" label="20 hrs" color="#531a45" opacity="${env('value_11',1)}"/>
<sld:ColorMapEntry quantity="1400" label="> 1 day" color="#291144" opacity="${env('value_12',1)}"/>
</sld:ColorMap>

write javascript with

let variable = '';
if (value >= 0 && value <= 10) {
    variable = '';
} else if (value > 20 && value <= 20) {
    variable = 'value_0:0;';
} else if (value > 20 && value <= 30) {
    variable = 'value_0:0;value_1:0;';
} else if (value > 30 && value <= 40) {
    variable = 'value_0:0;value_1:0;value_2:0;';
} else if (value > 40 && value <= 50) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;';
} else if (value > 50 && value <= 60) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;';
} else if (value > 60 && value <= 120) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;';
} else if (value > 120 && value <= 240) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;';
} else if (value > 240 && value <= 360) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;';
} else if (value > 360 && value <= 720) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;value_8:0;';
} else if (value > 720 && value <= 960) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;value_8:0;value_9:0;';
} else if (value > 960 && value <= 1200) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;value_8:0;value_9:0;value_10:0;';
} else if (value > 1200 && value <= 1400) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;value_8:0;value_9:0;value_10:0;value_11:0;';
} else if (value > 1400) {
    variable = 'value_0:0;value_1:0;value_2:0;value_3:0;value_4:0;value_5:0;value_6:0;value_7:0;value_8:0;value_9:0;value_10:0;value_11:0;value_12:0;';
}

and apply with this URL for changes.

https://localhost:8080/geoserver/wms?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&FORMAT=image%2Fpng&TRANSPARENT=true&LAYERS=geo%3Alayer_clim_w&TILED=true&WIDTH=320&HEIGHT=320&CRS=EPSG%3A3857&FORMAT_OPTIONS=dpi%3A113&BBOX=0%2C-5009377.085697312%2C5009377.085697311%2C-9.313225746154785e-10&env=variable

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.