Skip to content

Instantly share code, notes, and snippets.

@markjd84

markjd84/index.html

Last active December 14, 2017 13:44
Show Gist options
  • Save markjd84/9b8a5e2c10317c060bd99b4d98b7b79e to your computer and use it in GitHub Desktop.
Save markjd84/9b8a5e2c10317c060bd99b4d98b7b79e to your computer and use it in GitHub Desktop.
Download ZIP
Leaflet examples
Raw
index.html
<html>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ=="
crossorigin=""/>
<style>
body {
padding: 0;
margin: 0;
}
html, body, #mapid {
/* thanks http://bl.ocks.org/d3noob/7654694 */
height: 100%;
width: 100%;
}
</style>
<body>
<div id="mapid"></div>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log=="
crossorigin=""></script>
<script src="leaflet-examples.js"></script>
</body>
</html>
Raw
leaflet-examples.js
var mymap = L.map('mapid').setView([51.505, -0.09], 13);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
maxZoom: 18,
id: 'mapbox.streets',
accessToken: 'pk.eyJ1IjoibWFya2pkNCIsImEiOiJiMDNjN2FmOWQxZTViNzYyMmM0ZjRjMTA0OTI1YzU2OSJ9.GLfuFQPr-W1vM3OmGQp8SQ'
}).addTo(mymap);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment