I'm working on a React app with a mapbox component and am trying to understand the use case for react-map-gl vs the examples on the Mapbox site that just use mapbox-gl. From the React GitHub issues they mention this in regards to performance -
React may decide to render more than necessary than Mapbox would on its own, failing to account for how expensive the draw call is.
If you are using mapbox as nothing but a map display, generally speaking you do not need this library. If you are trying to match the map with any other React component, you will eventually run into the same issue.
But then the entire Mapbox studio is written I believe without any react wrappers...and there are plenty of React components in Studio besides the map, so it does not seem like this argument holds true. Anyone have thoughts or experience they can share?
reactjs - What's the difference between the components ReactMapGL and MapGL in the react-map-gl library? - Stack Overflow
question: Considerably lower FPS with react-map-gl compared to mapbox-gl
react-map-gl or mapbox-gl?
React-map-gl – React components for Mapbox GL JS
I'm really starting to get frustrated with this. I've seen a split between using react-map-gl and mapbox-gl usage in tutorials. It's all honestly kind of a mess cos no one tutorial/documentation is what I need it for. I thought I had figured something out but I realized my .js files arent acutally responisble for rendering the map. It's only rendering because of a <script> tag I found in one tutorial in the index.html file which is I feel like that's not what I want ultimately.
Ultimately I know I'm going to have to loop thru gelocation data in an API to add points on a map but if it's only because of that tag in html then why the hell use React to begin with? It's weird to me I can't find a striaght answer considering how popular React is.
I also hate JavaScript (cliche, I know) and am much more competent in Python so I'm considering scrapping this (honestly for like the sixth time now) and starting over in Django or Flask even thought I have zero experience with them.
Thoughts?
» npm install react-map-gl
» npm install react-mapbox-gl
I have done an app with react-native-maps and haven't used mapbox one. If you need to have a larger number of markers displayed at once it's tricky to get there (you'd have to fork the repository and change something in the Android/iOS parts of the codebase).
There should be no issues displaying 50 markers on the map but the CPU explodes (that's I guess one of the reasons why AirBnB in their app does not have many markers and limits the number when you look at a small region with hundreds of locations).
Given that mapbox seems to be more low level I guess there would be no issues with that.
If you are using Create-React-Native-App (Expo) to kick off your project, react-native-map is already included... I've done a bunch of Leaflet and Django work in the past, I found it pretty straight-forward to get going with this approach.
Adding Mapbox to Expo is "In Progress" https://expo.canny.io/feature-requests/p/add-mapbox-gl-support
I find the documentation for react-native-maps to be more example based (easier to understand) where as the Mapbox docs are API definition driven. Good, but not as approachable for those new to React-Native their library.
They will both work with GeoJson, no worries.