Explore the top 15 React map libraries to help you create interactive maps for your apps. These libraries offer a wide range of features, such as map rendering, clustering, and geocoding.
A custom layer for react-leaflet that makes plotting and clustering react components simple
react-leaflet-cluster-layer provides a simple component for plotting React components as markers and clusters in a react-leaflet map.
Github: http://github.com/OpenGov/react-leaflet-cluster-layer
Provides a simple component for plotting React Components as markers in a react-leaflet map
react-leaflet-marker-layer provides a simple component for plotting React components as markers in a react-leaflet map.
Official Website:https://github.com/OpenGov/react-leaflet-marker-layer
App with D3 Charts and Google Maps
This project contains the implementation of libraries D3, highcharts and react-google-maps with the ReactJS. It shows how easy is adding those libraries in ReactJS.
Live Demo: https://marekdano.github.io/react-charts-and-maps/
Official Website https://github.com/marekdano/react-charts-and-maps
React component for interactive vector maps of the world and 100+ countries.
Live Demo: https://react-vector-maps.netlify.com/
Official Website https://github.com/South-Paw/react-vector-maps/archive/master.zip
A react wrapper for jvectormap maps
Official Websitehttps://github.com/kadoshms/react-jvectormap
Simple loader to use google maps services into your react applications
React Component to use google maps services into your react applications using a render prop.
Live Demo: https://xuopled.github.io/react-google-maps-loader/
Official Website http://github.com/xuopled/react-google-maps-loader
Extensible React Component for Taipei Metro Map
Extensible React Component for SVG Taipei Metro Map. The design is mostly referenced from 曼努 manzoo and the post with some minor modifications.
Live Demo: https://rent.popoke.info/
Official Website http://github.com/popo55668/react-taipei-metro
React People lists and connects React developers around the world
Live Demo: https://www.reactpeople.org/
Official Website http://github.com/vitorleonel/reactpeople
Find and record your favourite photo spots Built React
Photo Locations is a personal project. When travelling with family or friends, you often don’t have enough time to extensively research photo locations when you are in new places.
This is where Photo Locations come in. You can look up locations that other users have entered or enter your own locations and give them some ratings.
Record your favourite photo spots and to research locations where you are travelling to.
The map will center in the location that you are currently at. From there you can check out any markers which will point you to cool photography locations.
From the marker you can click on more info to find out more about the location and to leave comments.
Right click on the map to add new locations.
Live Demo: http://www.photolocations.nz/
Official Website http://github.com/cornelia-schulz/photolocations
A custom layer for heatmaps in react-leaflet
react-leaflet-heatmap-layer provides a simple component for creating a heatmap layer in a react-leaflet map.
Official Website https://github.com/OpenGov/react-leaflet-heatmap-layer
A React component to build a customized UI for Google Maps Places Autocomplete.
Live Demo: https://hibiken.github.io/react-places-autocomplete/
Official Website https://github.com/hibiken/react-places-autocomplete
React component for 2gis-maps.
Live Demo: https://2gis.github.io/2gis-maps-react/#simple-map
Official Website: https://github.com/2gis/2gis-maps-react
Bing layer as React component for Leaflet build on top of React-Leaflet.
Official Website: http://github.com/Charmatzis/react-leaflet-bing
React Component for Mapbox GL JS
Mapbox GL JS is a JavaScript library that renders interactive maps from vector tiles and Mapbox styles using WebGL.
To use any of Mapbox’s tools, APIs, or SDKs, you’ll need a Mapbox access token. Mapbox uses access tokens to associate requests to API resources with your account. You can find all your access tokens, create new ones, or delete existing ones on your API access tokens page.
This package is heavily inspired by uber/react-map-gl.
Official Website: https://github.com/urbica/react-map-gl
google-map-react is a component written over a small set of the Google Maps API. It allows you to render any React component on the Google Map. It is fully isomorphic and can render on a server. Additionally, it can render map components in the browser even if the Google Maps API is not loaded. It uses an internal, tweakable hover algorithm - every object on the map can be hovered.
It allows you to create interfaces like this example (You can scroll the table, zoom/move the map, hover/click on markers, and click on table rows)
Live Demo: https://google-map-react.github.io/google-map-react/map/main/
Official Website http://github.com/google-map-react/google-map-react
#reactjs #javascript #programming