@larryamiel/peek-maps
v1.0.0
Published
A Mapbox react native module for creating custom maps
Downloads
4
Maintainers
Readme
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
Supported Implementations
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
- 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
Getting Started
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.
Run iOS Simulator
# Run with yarn
yarn run ios
# or Run with NPM
npm run ios
Run Android Emulator
# Run with yarn
yarn run android
# or Run with NPM
npm run android
Adding a map
import React from 'react';
import { StyleSheet, View } from 'react-native';
import Mapbox from '@rnmapbox/maps';
Mapbox.setAccessToken('<YOUR_ACCESSTOKEN>');
const App = () => {
return (
<View style={styles.page}>
<View style={styles.container}>
<Mapbox.MapView style={styles.map} />
</View>
</View>
);
}
export default App;
const styles = StyleSheet.create({
page: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
container: {
height: 300,
width: 300,
},
map: {
flex: 1
}
});
Documentation
Components
- MapView
- StyleImport
- Light
- StyleSheet
- PointAnnotation
- MarkerView
- Callout
- Camera
- UserLocation
- LocationPuck
- Images
- Image
- Models
Sources
Layers
- BackgroundLayer
- CircleLayer
- FillExtrusionLayer
- FillLayer
- LineLayer
- RasterLayer
- SymbolLayer
- HeatmapLayer
- SkyLayer
- ModelLayer
Terrain
Offline
Misc
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:
"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.
Scout To Hunt
Developer Group
Have a question or need some help? Join our Gitter developer group!