react-native-mapbox-gl / Maps
Licence: mit
A Mapbox GL react native module for creating custom maps
Stars: ✭ 893
Programming Languages
javascript
184084 projects - #8 most used programming language
Labels
Projects that are alternatives of or similar to Maps
map
🏳️🌈🗺 A map of community centers and other helpful information for queer (LGBTQ) people.
Stars: ✭ 15 (-98.32%)
Mutual labels: map, mapbox
traffic
Massively real-time traffic streaming application
Stars: ✭ 25 (-97.2%)
Mutual labels: map, mapbox
Airmapview
A view abstraction to provide a map user interface with various underlying map providers
Stars: ✭ 1,824 (+104.26%)
Mutual labels: mapbox, map
angular-mapboxgl-directive
AngularJS directive for Mapbox GL
Stars: ✭ 43 (-95.18%)
Mutual labels: map, mapbox
L7
🌎 Large-scale WebGL-powered Geospatial Data Visualization analysis framework which relies on Mapbox GL or AMap to render basemaps.
Stars: ✭ 2,517 (+181.86%)
Mutual labels: mapbox, map
transit
Massively real-time city transit streaming application
Stars: ✭ 20 (-97.76%)
Mutual labels: map, mapbox
kirby-locator
A simple map & geolocation field, built on top of open-source services and Mapbox. Kirby 3 only.
Stars: ✭ 83 (-90.71%)
Mutual labels: map, mapbox
ReminderPro
ReminderPro(location, note, voice recording)
Stars: ✭ 27 (-96.98%)
Mutual labels: map, mapbox
Mapbox Gl Native
Interactive, thoroughly customizable maps in native Android, iOS, macOS, Node.js, and Qt applications, powered by vector tiles and OpenGL
Stars: ✭ 4,091 (+358.12%)
Mutual labels: mapbox, map
Mapbox Gl Native Android
Interactive, thoroughly customizable maps in native Android powered by vector tiles and OpenGL
Stars: ✭ 135 (-84.88%)
Mutual labels: mapbox, map
Mapbox Gl Js
Interactive, thoroughly customizable maps in the browser, powered by vector tiles and WebGL
Stars: ✭ 8,017 (+797.76%)
Mutual labels: mapbox, map
FramerMapboxJS
Simplest way to integrate Mapbox maps on your Framer prototypes.
Stars: ✭ 45 (-94.96%)
Mutual labels: map, mapbox
Mbxmapkit
DEPRECATED - Lightweight Mapbox integration with MapKit on iOS
Stars: ✭ 332 (-62.82%)
Mutual labels: mapbox, map
Iclient Javascript
Modern GIS Web Client for JavaScript, based on Leaflet\OpenLayers\MapboxGL-JS\Classic(iClient8C), enhanced with ECharts\D3\MapV etc. Contributed by SuperMap & community.
Stars: ✭ 593 (-33.59%)
Mutual labels: map
Transportr
Free Public Transport Assistant without Ads or Tracking
Stars: ✭ 678 (-24.08%)
Mutual labels: map
Mapbox Maps SDK for React Native
An unofficial React Native library for building maps with the Mapbox Maps SDK for iOS and Mapbox Maps SDK for Android
Installation
Prerequisit
On Android we support from version 6 (API 23) upwards
Dependencies
- node
- npm
- React Native (0.60+)
Git
git clone [email protected]:react-native-mapbox-gl/maps.git
cd maps
Yarn
yarn add @react-native-mapbox-gl/maps
Npm
npm install @react-native-mapbox-gl/maps --save
Installation Guides
Getting Started
For more information, check out our Getting Started section
Adding a map
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>
);
}
}
Documentation
Components
Sources
Layers
- BackgroundLayer
- CircleLayer
- FillExtrusionLayer
- FillLayer
- LineLayer
- RasterLayer
- SymbolLayer
- HeatmapLayer
Offline
Misc
Expo Support
We have a feature request open with Expo if you want to see it get in show your support https://expo.canny.io/feature-requests/p/add-mapbox-gl-support
Testing with Jest
This library provides some mocks which are necessary for running tests.
Example:
"jest": {
"preset": "react-native",
"setupFilesAfterEnv": ["@react-native-mapbox-gl/maps/setup-jest"]
}
Developer Group
Have a question or need some help? Join our Gitter developer group!
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].