HTML JS

GET GPS COORDINATES & DISPLAY MAP

(quick guide & example)

LOAD MAPBOX API <script src="https://api.mapbox.com/ ABC">/script> <link rel="stylesheet" href="https://api.mapbox.com/XYZ">

LOAD MAP HERE <div id="map" style="width:100%; height:400px;"></div>

THE HTML

02

YOUR TOKEN HERE mapboxgl.accessToken = 'TOKEN';

GET GPS COORDINATES & DRAW MAP navigator.geolocation.getCurrentPosition( pos => {   let map = new mapboxgl.Map({     container: "map", zoom: 13, style:      "mapbox://styles/mapbox/streets-v11",     center: [pos.coords.longitude,     pos.coords.latitude]   });   let marker = new mapboxgl.Marker()   .setLngLat([pos.coords.longitude,   pos.coords.latitude]).addTo(map); });

THE JAVASCRIPT

03