CODEWITHSUNDEEP
mapboxmapbox-gl-js
Juan Francisco Saldarriaga
Juan Francisco Saldarriaga

Reputation: 169

How to use `in` expression in Mapbox GL map.setFilter

I'm trying to filter a geoJson layer (called "destinations") based on a set of conditions. My "destinations" layer has a property called uniqueID of type string, which most of the time only has one numeric ID, but sometime has more than one. I would like to filter this layer (using map.setFilter) based on an array of IDs. The filter should do something like this: if any of the uniqueID values in the "destination" layer are found in the array of IDs, then filter that feature out.

Here is an snippet of my "destinations" layer:

{ "type": "Feature", "properties": { "destinationLon": -74.20716879, "destinationLat": 40.69097357, "uniqueID": "2029" }, "geometry": { "type": "Point", "coordinates": [ -74.20716879, 40.69097357 ] } },
{ "type": "Feature", "properties": { "destinationLon": -74.20670807, "destinationLat": 40.69137214, "uniqueID": "984,985" }, "geometry": { "type": "Point", "coordinates": [ -74.20670807, 40.69137214 ] } },
{ "type": "Feature", "properties": { "destinationLon": -74.20651489, "destinationLat": 40.71887889, "uniqueID": "1393" }, "geometry": { "type": "Point", "coordinates": [ -74.20651489, 40.71887889 ] } }

And here is a sample of the array of IDs I might use: [2000, 984, 1393]

I have tried using a filter using the in expression (documentation here) like this:

let thisFilter = ["any"].concat(uniqueIDs.map(id => ["in", id, ["get", "uniqueID"]]));
map.setFilter("destinations", thisFilter);

But I keep on getting this error message:

Error: "layers.destinations.filter[0][2]: string, number, or boolean expected, array found"

However, the documentation states the following:

["in",
    keyword: InputType (boolean, string, or number),
    input: InputType (array or string)
]: boolean

The third argument in the expression is supposed to be an array. Why then am I getting that error?

Any ideas? Thank you!

Upvotes: 2

Views: 3825

Answers (1)

Steve Bennett
Steve Bennett

Reputation: 126295

I think your error has nothing to do with in. You could discover this by simplifying your expression, and separating out the any from the individual in parts.

Your error is that any takes a variable number of parameters:

['any', ['in', ...], ['in', ...]]

Whereas you are passing in an array:

['any', [['in', ...], ['in', ...]]]

I would rewrite your expression like this:

let thisFilter = ["any", ...uniqueIDs.map(id => ["in", id, ["get", "uniqueID"]])];

Upvotes: 3

Related Questions