Skip to content

Instantly share code, notes, and snippets.

@danswick
Created April 9, 2020 00:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danswick/6df3f4e235db1dc35bb2e808db4357ee to your computer and use it in GitHub Desktop.
Save danswick/6df3f4e235db1dc35bb2e808db4357ee to your computer and use it in GitHub Desktop.
Baygeo class 3 pairing session starter code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Display a map</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<script src="https://api.mapbox.com/mapbox-gl-js/v1.7.0/mapbox-gl.js"></script>
<link href="https://api.mapbox.com/mapbox-gl-js/v1.7.0/mapbox-gl.css" rel="stylesheet" />
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
// Initialize the map
mapboxgl.accessToken = '<your access token here>';
var map = new mapboxgl.Map({
container: 'map', // container id
style: 'mapbox://styles/mapbox/streets-v11', // stylesheet location
center: [-122.44, 37.76], // starting position [lng, lat]
zoom: 11 // starting zoom
});
// Add a popup: https://docs.mapbox.com/mapbox-gl-js/example/popup/
// Add pan and zoom controls: https://docs.mapbox.com/mapbox-gl-js/example/navigation/
// Add a geolocation button: https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment