CODEWITHSUNDEEP
openlayersopenlayers-3
ejo4041
ejo4041

Reputation: 325

Filtering ol.layer.Vector locally by feature properties

I have an openlayer-3 web app that I need to do some filtering of layers on. The layer happens to be from a WFS source. I would like the option to filter as a GetFeature CQL request to the server and also filter locally on the data.

I have not gotten the CQL request working yet. In the mean time, I would like to filter the vector data locally based on the feature properties like in Openlayers 2. Is there a way to do this easily? Has the Filter object not been included in ol3 on purpose?

EDIT: I would love to have a filter like this in ol3:
http://dev.openlayers.org/examples/cql-format.html

Upvotes: 2

Views: 3419

Answers (1)

joaorodr84
joaorodr84

Reputation: 1312

I have found a solution by parsing the CQL filter and filtering out the features before adding them to the layer.

/* Your filter ... */
var cql = "STATE_ABBR >= 'B' AND STATE_ABBR <= 'O'";

/* Gets all the features from the current extent */
var features = new ol.format.WFS().readFeatures(response);

/**
 * Find a way to parse your CQL filter, for example, replace the 'AND's into '&&'s
 * It would be better to build a parser. You can use this: http://pegjs.org/
 */

/* Filters the features */
features = features.filter(function (feature) {
    return feature.get('STATE_ABBR') >= 'B' && feature.get('STATE_ABBR') <= 'O';
});

/* Adds the features to the layers */
layerWFS.getSource().addFeatures(features);

Try building a parser with PEGjs

Your parser should transform this

"STATE_ABBR >= 'B' AND STATE_ABBR <= 'O'"

into this

feature.get('STATE_ABBR') >= 'B' && feature.get('STATE_ABBR') <= 'O'

See the example here

The key is really PEGjs here. :) I hope I helped...

Upvotes: 1

Related Questions