leaflet.measure/example.html at master · onaci/leaflet.measure · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.2/dist/leaflet.css" />
		<link rel="stylesheet" href="leaflet.measure/leaflet.measure.css" />
		<script src="https://unpkg.com/leaflet@1.9.2/dist/leaflet.js"></script>
		<script src="leaflet.measure/leaflet.measure.js"></script>
	</head>

	<body>
		<div id="map" style="width: 100%; height: 600px;"></div>

		<script type="text/javascript">
			const layerOsm = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
				subdomains: ["a", "b", "c"],
				maxZoom: 18
			});

			const map = new L.Map('map', {
				measureControl: {
					enabled: true,
					unitLabel: 'km',
					unitFactor: 1000
				}
			}).addLayer(layerOsm).setView(new L.LatLng(40.524724, -3.816153), 6);
		</script>
	</body>
</html>