Mapbox Maps SDK for React Native

|  |  |
|---|---|

_A community-supported, open-source React Native library for building maps with the Mapbox Maps SDK for iOS and Mapbox Maps SDK for Android_

---

News & Discussions

#### → Call for additional maintainers discussion thread

---

---

$3

At the moment we support Mapbox (v10) and Mapbox (v11) beta.
We default to Mapbox (v10).

_See iOS & Android setup guide for using v11 beta_

Prerequisite

1. Please Sign Up to Mapbox to get the Mapbox Access Token.

Dependencies

- node
- npm
- React Native (0.70+, older versions from 0.64+ might or might not work)

Installation

Check our Installation instructions

$3

For more information, check out our Getting Started section

Run Project

Before you run your project be sure you have completed the Installation Guides for Android or iOS.

$3

``sh

Run with yarn

yarn run ios

or Run with NPM

npm run ios
`

$3

`sh

Run with yarn

yarn run android

or Run with NPM

npm run android
`

Adding a map

`js
import React from 'react';
import { StyleSheet, View } from 'react-native';
import Mapbox from '@rnmapbox/maps';

Mapbox.setAccessToken('');

const App = () => {
return (





);
}

export default App;

const styles = StyleSheet.create({
page: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
container: {
height: 300,
width: 300,
},
map: {
flex: 1
}
});
`
---


Documentation

$3

- MapView
- StyleImport
- Light
- StyleSheet
- PointAnnotation
- MarkerView
- Callout
- Camera
- UserLocation
- LocationPuck
- Images
- Image
- Models

$3

- VectorSource
- ShapeSource
- RasterSource
- RasterDemSource

$3

- BackgroundLayer
- CircleLayer
- FillExtrusionLayer
- FillLayer
- LineLayer
- RasterLayer
- SymbolLayer
- HeatmapLayer
- SkyLayer
- ModelLayer

$3

- Terrain
- Atmosphere

$3

- OfflineManager
- SnapshotManager

$3

- Mapbox
- CustomHttpHeaders
- Logger

Expo Support

This package is not available in the Expo Go app. Learn how you can use it with custom dev clients.

Testing with Jest

This library provides some mocks which are necessary for running tests.

Example:

`json
"jest": {
"preset": "react-native",
"setupFilesAfterEnv": ["@rnmapbox/maps/setup-jest"],
"transformIgnorePatterns": [
"node_modules/(?!(...|@rnmapbox))"
]
}
``
---

Sponsors

Help drive this repo forward - be a sponsor. Add a comment here to discuss your sponsorship.

alt="Scout To Hunt" height="60" />	alt="Terrain Dance LLC" height="60" />
Scout To Hunt	Terrain Dance

---

Developer Group

Have a question or need some help? Use Github discussions or the react-native channel in the mapbox discord.