Styling WMS layers in OL3

Question

I have managed to get my WMS layers working in OL3.
Now I want to style them, as they are all set as blue on the server side and I can't change that. I know the common answer seems to be WMS is an image and you can't style it like a vector but there are examples of people doing complicated dynamic styling with SLDs so it must be possible to use an SLD to change the layer colour - depending on the server?

I have had a look at one examplebut that is OL2.9 and for WMS.post layers and I don't know what they are.

My rough ol3 code is here so you can see where I am at

Answer 1

Styling WMS layers using SLD still means images styled on the server.

Open-source WMS implementations like GeoServer and MapServer support styling WMS layers with SLD. See the SLD-related MapServer and GeoServer docs for example.

So one option is to create the SLD on the client and send it in the WMS GetMap request through the SLD_BODY query string param. The WMS then uses the SLD for the rendering on the image.

Using OpenLayers 3 this will look like this:

var wmsLayer = new ol.layer.Tile({
  source: new ol.source.TileWMS({
    url: http://url-to-wms.com,
    params: {
      // ...
      'SLD_BODY': urlEncodedSLDString
    }
  })
});

Note that, as opposed to OpenLayers 2, OpenLayers 3 doesn't support sending WMS GetMap requests using POST. Using POST allows sending SLDs of practically any size, but the implementation in OpenLayers 2 is, in my opinion, not very robust—I won't use it in production.

But do you really need to create the style definition on the client? If you just need a fixed number of style definitions you can define style definitions on the server, once for good, and refer to them by their names in WMS GetMap requests, through the Style query string param. I'd recommend using this if you don't need to define styles dynamically on the client.