Leaflet wms filter

[David Alvey]

I need to be able to filter the results from a wms request so rather than showing the full A road network I could show the B5235 for example.
In the geoserver url you use: Link to example

How do I do this in leaflet?

Any ideas folks?

[Bryan McBride]

You should be able to just append a GeoServer cql_filter to one of the existing options like so:

var myWMS = L.tileLayer.wms("http://geoserver2.webapp.derbyshire.local:8080/geoserver/Base_Map/wms", {

    layers: "Base_Map:Strategy%20-%20B%20Roads",

    format: "image/png&cql_filter=NUMBER0='B5235'",

    transparent: true

});

Kind of a hack, but it should work.

BRYAN

[David Alvey]

You are a star!

Had to change it a bit as could not get that quiet working but with a bit of modification I got it working.

var FilterLayer = new L.TileLayer.WMS("http://wms2.derbyshire.gov.uk/wms", {
            layers: "Base_Map:Strategy%20-%20B%20Roads",
            format: "image/png&filter=<PropertyIsEqualTo><PropertyName>NUMBER0</PropertyName><Literal>B5053</Literal></PropertyIsEqualTo>",
            transparent: true
        });

Example

Thanks again!

[Neil]

Hi,

There is a slightly less hacky way of doing the same thing which is a bit more manageable.

Once you have your Geoserver WMS layer inititalised you can use:

var cqlFilter = "NUMBER0%3D'B5235>"

FilterLayer.setParams({CQL_FILTER:cqlFilter })

This way, you can dynamically update the filter and apply it to the layer as and when you need to update the layer selection.

There is often a bit of faffing around making sure that you have all your URL components encoded correctly (e.g. representing white space as "%20" and equals as "%3D", but once you have a working pattern, it's very helpful.