A ReactViro + Mapbox integration for Navigate to one geoposition to another using Augmented Reality
1.- Clone the repository :
2.- Install modules : yarn install or mpn install; depending in how you manage your modules
3.- Get a Viro and Mapbox Token: ViroKey and Mapbox
4.- Use your Viro Key and Mapbox Token in App.js where says "USE_YOUR_KEY_HERE"
3.- Feel free to Use and Re-Use this code.
api/ -> contais the pois and search method
screens/ -> contains the menu views or "screens" using 'react-navigation'
App.js -> Main File.
screens/HomeScreen.js -> Main screen contains search POI function
screens/MapScreen.js -> contains a renderable map using Mapbox API. Renders the POI and the current location.
screens/ArScreen.js -> Render the ViroPolyline that handles the AR pathway experience
api/pois.js -> contains the points of interest with latitude and longitude
api/index.js -> contains the method to search points
Using the search function inside 'api/index.js' you can search an specific POI (Point of Interes)
Once the point is located in the searchbar select the point and the app prompt an alert to "show this point in the map", next the point is showed in the map using a pointer. So, there you have two buttons one to back to the searchbar and one to go to AR navigation.
Because im using geoposition the async function to search for the point, this is gone to take a moment to activate the button to go to AR Navigation.
This use the Proj4 module to transform GPS points (latitude,longitude) to Cartesian Points (x,y,z) then use this (x,y,z) point to render the ViroPolyline.
Especial Thanks to Isaac Besora