Subtract (xor) mapbox-gl-js layers

Question

I'm making a app using mapbox-gl-js in which I have two layers and I wondered if it is possible to subtract one layer from the other.

By "substract" I mean it should only draw parts of the 1st layer and 2nd layer that don’t overlap each other.

Is it possible to do this ?

Answer 1

You will need change or add a new source to reflect this. Turf has a few functions to difference polygons which you should be able to use to get the xor.

PS. This is similar to something previously proposed to invert a feature without actually changing the source https://github.com/mapbox/mapbox-gl-js/issues/993,