Added Satellite Streets example (#10)

mapbox · Sep 10, 2020 · e53fdcb · e53fdcb
1 parent 91d9e5a
commit e53fdcb
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -39,6 +39,7 @@ map.on('load', () => {
 -   [Mapbox Day Traffic](https://mapbox.github.io/mapbox-gl-traffic/examples/traffic-day.html)
 -   [Mapbox Night Traffic](https://mapbox.github.io/mapbox-gl-traffic/examples/traffic-night.html)
 -   [Mapbox Streets](https://mapbox.github.io/mapbox-gl-traffic/examples/mapbox-streets.html)
+-   [Mapbox Satellite Streets](https://mapbox.github.io/mapbox-gl-traffic/examples/mapbox-satellite-streets.html)
 -   [Mapbox Outdoors](https://mapbox.github.io/mapbox-gl-traffic/examples/mapbox-outdoors.html)
 -   [Mapbox Light](https://mapbox.github.io/mapbox-gl-traffic/examples/mapbox-light.html)
 -   [Mapbox Dark](https://mapbox.github.io/mapbox-gl-traffic/examples/mapbox-dark.html)

diff --git a/examples/mapbox-satellite-streets.html b/examples/mapbox-satellite-streets.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset='utf-8' />
+    <title>Mapbox GL Traffic</title>
+    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
+    <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.1/mapbox-gl.js'></script>
+    <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.1.1/mapbox-gl.css' rel='stylesheet' />
+    <script src='../mapbox-gl-traffic.js'></script>
+    <link href='../mapbox-gl-traffic.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>
+mapboxgl.accessToken = 'pk.eyJ1IjoibW9yZ2Vua2FmZmVlIiwiYSI6IjIzcmN0NlkifQ.0LRTNgCc-envt9d5MzR75w';
+var map = new mapboxgl.Map({
+    container: 'map',
+    style: 'mapbox://styles/mapbox/satellite-streets-v10',
+    center: [-77.0259, 38.9010],
+    zoom: 9,
+    hash: true
+});
+map.addControl(new mapboxgl.NavigationControl());
+map.addControl(new MapboxTraffic());
+</script>
+
+</body>
+</html>