We are developing a web application which draws polygons on a map (a satellite image). We use the react-map-gl library to draw the polygons. The polygons are semi-transparent (you can see objects on the satellite image through the polygons). We use the Layer and Source components from react-map-gl.
We have a problem with drawing nested polygons. For example, if we have a polygon of a lake and a polygon of an island in the lake, the semi-transparent polygons clash with each other and the color of the nested polygon is wrong (it's a mix of the lake and the island polygons colors).
Is it possible to draw semi-transparent nested polygons correctly?
We tried to find a way for displaying polygons with holes but haven't found any.
