31 lines
724 B
Svelte
31 lines
724 B
Svelte
<script lang="ts">
|
|
import 'leaflet/dist/leaflet.css';
|
|
import lignes from './lignes.json';
|
|
|
|
import L from 'leaflet';
|
|
|
|
function createMap(node: HTMLElement) {
|
|
const map = L.map(node).setView([45.76, 4.832], 13);
|
|
|
|
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
maxZoom: 19,
|
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
|
}).addTo(map);
|
|
|
|
lignes.features.forEach((feature) => {
|
|
const color = 'rgb(' + feature.properties.couleur.replaceAll(' ', ',') + ')';
|
|
|
|
// @ts-ignore
|
|
L.geoJSON(feature, { style: { color } }).addTo(map);
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<div class="map" use:createMap></div>
|
|
|
|
<style>
|
|
.map {
|
|
height: 100vh;
|
|
width: 100%;
|
|
}
|
|
</style>
|