DEV Community

Pierre
Pierre

Posted on

4

How can I integrate Leaflet to React Native

Hi,
I am very new with React Native. I built a smartphone app with Cordova but I want to migrate to Reat Native. My App use and need Leaftlet and Chartjs and I need to find a way to use those feature with my new Reat Native 7.6 and Expo App.

I investigated one full days trying different npm with React Native Leaflet but it looks like have been done for the 7.3 version or older, or I simply could not implement it due to my lake of practice with React Native.

I will appreciate if you could share your expertise with Leaftlet for React Native 7.6.

  1. I found the React-leaflet npm. Is it compatible with React Native? or it's only built for React?

  2. Would it possible to "inject" my javascript script, I developed for my web app. My Idea is to use my Javascript script I developped for my Cordova App (instead of the web app, even if it's very similar) and import is to React Native with some adaptaption. In that case, I would not need a npm.

My I create a map.js and include the leaflet js library and "duplicate" my cordova javascript script?

  1. Do you have any experience with leaftlet and React Native 7.6?

Note: I would like to use OpenStreetMap instead of Google and Apple Map.

Many thanks for any help and I wish you a nice day
Cheers

Top comments (2)

Collapse
 
dusan_spasojevic_539199c2 profile image
Dusan Spasojevic

Any update, did you manage to do it?

Collapse
 
pierrot10 profile image
Pierre • Edited

Hi, Aïe. it looks like react-leaflet can not be used with React Native.

But then how could I import the leaflet javascript library?

Heroku

Save time with this productivity hack.

See how Heroku MCP Server connects tools like Cursor to Heroku, so you can build, deploy, and manage apps—right from your editor.

Learn More

👋 Kindness is contagious

Discover fresh viewpoints in this insightful post, supported by our vibrant DEV Community. Every developer’s experience matters—add your thoughts and help us grow together.

A simple “thank you” can uplift the author and spark new discussions—leave yours below!

On DEV, knowledge-sharing connects us and drives innovation. Found this useful? A quick note of appreciation makes a real impact.

Okay