React-map-gl – React components for Mapbox GL JS | Hacker News Reader

React-map-gl – React components for Mapbox GL JS

uber.github.io

148 pointspolskibus27 comments

Having used this, its not without its issues.

  * Adds a performance penalty over straight Mapbox-GL.
  * No support for animations / flyovers / etc.
  * You have to give width/height in pixels for map size.
  * Can't introspect map to get layer / point data w/o hacks.

The recent ver 3.0 was a big improvement.

These issues were big enough that I just recently removed this library on a new project in favor of straightforward Mapbox GL JS. The inability to use percentages for height/width is a major drawback. No sense in adding size to the bundle for fewer options.

Seconded, in our case we haven't yet but its on the roadmap.

It does not make it easy to access the mapbox library API directly. It claims there is a way, but it's not documented.

You can get the mapbox-gl map instance by using a ref and then grabbing the mapbox-gl map off of that (but not documented or officially supported).

Bit of a plug, but I recently built something using this and found it really easy to use with react https://blog.georgejose.com/visualizing-transit-vehicle-loca...

Great post, well written, thanks for sharing.

You want to fix: 359s => 359ms in your post.

Thanks for noticing that!

That's a great app!

I have long standing hate-on for the TTC's inefficiency... buses that more-often-than-not travel in clusters where the first one is half full, the remaining ones are empty. The TTC constantly raises fares but does little to utilize technology to make themselves more efficient!

/rant

This is a really neat app. How long did it take and was it just a personal side project?

It would be nice if you animated the position changes to avoid the jumpiness.

EDIT: Completely misread this as ReactNative instead of React for some reason. Ignore all of the below.

---

This is being released on the back of the "official" Mapbox GL React Native library[0] just having new resources[1] committed to it after having been neglected for 1.5 years[2].

I haven't looked into it at all yet, but I wonder was it borne out of frustration (commits seems to have started shortly after the last MBRNGL release), and what the Mapbox guys' perspective on it in terms of differentiating the libraries.

[0] https://github.com/mapbox/react-native-mapbox-gl/

[1] https://github.com/mapbox/react-native-mapbox-gl/issues/590#...

[2] https://github.com/mapbox/react-native-mapbox-gl/releases/ta...

I don't believe Uber's component works in React Native, so I don't think your claim is correct.

I contacted Mapbox about their React Native library and they said it's defunct and they won't be supporting it. Been using AirBnBs mapping library for RN. It does the job but def has some rough edges.

How long ago did you contact them? The recent activity on the repo issues seems to indicate a change of heart on their part.

We expanded our team and are working on improvements to React Native SDK, which was initially a side project from one of our engineers. We’re excited to support the library and get it to feature parity with our native iOS, Android, and Qt SDKs.

Disclaimer: I work with the mobile team at Mapbox.

AFAIK Uber switched back to Google Maps... does anyone know why they are still working on Mapbox code?

I seem to recall from the last time I stumbled on this it's largely used for internal visualization and tools

Any backstory on why they switched back? Having tried using Google Maps and Earth APIs, they are as opaque and impossible to extend as closed source API/library get.

I prefer https://github.com/alex3165/react-mapbox-gl over this library. It seems better maintained and documented.

That's a good library but I had a hard time getting it to work with server side rendering. Ended up having do to a dynamic import with Next.js 3 beta just to get the page to work. This problem affects most mapping libs, not sure if Uber's is any different.

I think it's way better than the Uber library. We tried both and ended up going with this version and it was much more flexible for our needs.

Uber's library was the reason i moved to alex3165's version. Every update came with a day of debugging. Hopefully the new version is any better.

Somewhat related, anyone have a good list of drop-in React components organized in categories? I'm thinking of something like iOS Cookies for React Components.

Check out

Boundless: Accessible, Battle-Tested, Composable React Components

https://boundless.js.org

There's a good list of React components at https://github.com/brillout/awesome-react-components , and https://js.coach is an auto-generated search engine for React-related libraries on NPM with some category filtering.

Just as a heads up for people supporting Safari and all iOS users, there's some sort of a leak in Safari which causes Mapbox-gl type apps to crash with the famous "A problem occurred with this webpage so it was reloaded" problem on iOS

https://bugs.webkit.org/show_bug.cgi?id=172790

Reply on news.ycombinator.com