27 lines
720 B
HTML
27 lines
720 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Map</title>
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css"/>
|
|
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
|
|
<style>
|
|
#map { height: 90vh; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="map"></div>
|
|
<script>
|
|
function style(feature) {
|
|
return { color: feature.properties.color};
|
|
}
|
|
var map = L.map('map').setView([47.6062, -122.3321], 12);
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
maxZoom: 18,
|
|
}).addTo(map);
|
|
|
|
fetch('/geojson')
|
|
.then(res => res.json())
|
|
.then(data => L.geoJSON(data, {style: style}).addTo(map));
|
|
</script>
|
|
</body>
|
|
</html> |