Skip to content

Instantly share code, notes, and snippets.

@mastersigat

mastersigat/.block

Created January 27, 2020 23:01
Show Gist options
  • Save mastersigat/9add93c382b2c1478ff095544ccc6d71 to your computer and use it in GitHub Desktop.
Save mastersigat/9add93c382b2c1478ff095544ccc6d71 to your computer and use it in GitHub Desktop.
Download ZIP
#Leaflet / Afficher un fond de carte en tuiles vectorielles
Raw
.block
license: mit
Raw
index.html
<html>
<head>
<title>A Leaflet map!</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"></script>
<script src='https://api.mapbox.com/mapbox.js/v3.2.1/mapbox.js'></script>
<link href='https://api.mapbox.com/mapbox.js/v3.2.1/mapbox.css' rel='stylesheet' />
<style>
#map {width: 100%; height:800px; margin: auto; }
</style>
</head>
<body>
<div id="map"></div>
<script>
// Initialiser la carte
L.mapbox.accessToken = 'pk.eyJ1IjoibmluYW5vdW4iLCJhIjoiY2pjdHBoZGlzMnV4dDJxcGc5azJkbWRiYSJ9.o4dZRrdHcgVEKCveOXG1YQ';
var map = L.map('map', {
center: [48.11, -1.66],
zoom: 13 });
L.tileLayer( 'https://api.mapbox.com/styles/v1/mapbox/dark-v9/tiles/{z}/{x}/{y}?access_token=' + L.mapbox.accessToken, {
tileSize: 512,
zoomOffset: -1,
attribution: '© <a href="https://apps.mapbox.com/feedback/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment