Difference between revisions of "Web Element: Data"
Line 184: | Line 184: | ||
</html> | </html> | ||
|} | |} | ||
+ | |||
+ | <!DOCTYPE html> | ||
+ | <html> | ||
+ | |||
+ | <head> | ||
+ | <meta charset='utf-8' /> | ||
+ | <title>Get started with the Isochrone API</title> | ||
+ | <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' /> | ||
+ | <!-- Import Mapbox GL JS --> | ||
+ | <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v1.10.0/mapbox-gl.js'></script> | ||
+ | <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.10.0/mapbox-gl.css' rel='stylesheet' /> | ||
+ | <!-- Import Assembly --> | ||
+ | <link href='https://api.mapbox.com/mapbox-assembly/v0.23.2/assembly.min.css' rel='stylesheet'> | ||
+ | <script src='https://api.mapbox.com/mapbox-assembly/v0.23.2/assembly.js'></script> | ||
+ | <!-- Import jQuery --> | ||
+ | <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script> | ||
+ | |||
+ | <style> | ||
+ | body { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | #map { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | bottom: 0; | ||
+ | width: 100%; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | |||
+ | <body> | ||
+ | <!-- Create a container for the map --> | ||
+ | <div id='map'></div> | ||
+ | |||
+ | <script> | ||
+ | // Add your Mapbox access token | ||
+ | mapboxgl.accessToken = 'pk.eyJ1Ijoia2lsdGVyIiwiYSI6IkEyNkVMb3cifQ.S4BPGK9G2NnoopYXnqAK7g'; | ||
+ | var map = new mapboxgl.Map({ | ||
+ | container: 'map', // Specify the container ID | ||
+ | style: 'mapbox://styles/mapbox/streets-v11', // Specify which map style to use | ||
+ | center: [-77.0369,38.895], // Specify the starting position | ||
+ | zoom: 11.5, // Specify the starting zoom | ||
+ | }); | ||
+ | </script> | ||
+ | </body> | ||
+ | |||
+ | </html> |
|
|
<!DOCTYPE html>
hkilter.com by H. K. Ilter is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License
© 2020 H. K. Ilter