nitaliano / react-native-mapbox-gl

A Mapbox GL react native module for creating custom maps
Other
2.16k stars 699 forks source link

Cut/Clip/Crop Image (ImageSource) with ShapeSource #1609

Open ksulia opened 5 years ago

ksulia commented 5 years ago

Is there a way to crop/clip an image (url) using ImageSource with a geoJSON shape in ShapeSource?

OR

A way to "fill" the geoJSON ShapeSource with the image (url) - not patterned the way fillPattern renders on zoom, but contained within some lat/lon bounds?

Thanks!

mnuriyumusak commented 4 years ago

Did you find any solution to this?

ksulia commented 4 years ago

@mnuriyumusak Unfortunately no. For the time being I am using the approach of just placing the uncropped image at the appropriate coordinates on the map, and then placing a massive geoJson (essentially wrapping the globe) on top with a hole cut out in the shape i want. This means, though, that for this particular layer the mapbox map is essentially hidden by the geoJson file (and state/country boundaries I then add on top). I would still love a solution to this, but have been busy with other things so haven't revisited.

Attached are some screenshots, one with the map as is with CircleLayer and the other as I describe.

IMG_2277

IMG_2278