An unofficial React Native library for building maps with
the Mapbox Maps SDK for iOS and Mapbox Maps SDK for Android
We also support MapLibre flavors of Mapbox SDKs now 🎉
On Android we support from version 6 (API 23) upwards
- node
- npm
- React Native (0.60+)
git clone git@github.com:react-native-mapbox-gl/maps.git
cd maps
yarn add @react-native-mapbox-gl/maps
npm install @react-native-mapbox-gl/maps --save
For more information, check out our Getting Started section
import React, { Component } from "react";
import { StyleSheet, View } from "react-native";
import MapboxGL from "@react-native-mapbox-gl/maps";
MapboxGL.setAccessToken("<YOUR_ACCESSTOKEN>");
const styles = StyleSheet.create({
page: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "#F5FCFF"
},
container: {
height: 300,
width: 300,
backgroundColor: "tomato"
},
map: {
flex: 1
}
});
export default class App extends Component {
render() {
return (
<View style={styles.page}>
<View style={styles.container}>
<MapboxGL.MapView style={styles.map} />
</View>
</View>
);
}
}- BackgroundLayer
- CircleLayer
- FillExtrusionLayer
- FillLayer
- LineLayer
- RasterLayer
- SymbolLayer
- HeatmapLayer
This package is not available in the Expo Go app. Le 6BED arn how you can use it with custom dev clients.
This library provides some mocks which are necessary for running tests.
Example:
"jest": {
"preset": "react-native",
"setupFilesAfterEnv": ["@react-native-mapbox-gl/maps/setup-jest"]
}Have a question or need some help? Join our Gitter developer group!