Created
June 9, 2021 11:50
-
-
Save simon04/21ae8e3d07ec7f6b62ba5dcad403cc4a to your computer and use it in GitHub Desktop.
Leaflet example using JavaScript modules
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1" /> | |
<link | |
rel="stylesheet" | |
href="https://unpkg.com/[email protected]/dist/leaflet.css" | |
/> | |
</head> | |
<body> | |
<div id="map" style="height: 600px"></div> | |
<script type="module"> | |
import { Map } from "https://unpkg.com/[email protected]/src/map"; | |
import { TileLayer } from "https://unpkg.com/[email protected]/src/layer/tile/TileLayer"; | |
import "https://unpkg.com/[email protected]/src/layer/vector/Renderer.getRenderer"; | |
import "https://unpkg.com/[email protected]/src/control/Control.Attribution"; | |
import "https://unpkg.com/[email protected]/src/control/Control.Zoom"; | |
const map = new Map("map").setView([51.505, -0.09], 13); | |
new TileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { | |
attribution: | |
'© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', | |
}).addTo(map); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hey. Thanks.