feat: add info banner
All checks were successful
deploy to cloudflare pages / deploy (push) Successful in 42s

This commit is contained in:
uku 2024-10-22 14:35:20 +02:00
parent aea400e306
commit 4efa212d00
Signed by: uku
SSH key fingerprint: SHA256:4P0aN6M8ajKukNi6aPOaX0LacanGYtlfjmN+m/sHY/o

View file

@ -8,6 +8,9 @@
const linesUrl = const linesUrl =
"https://data.grandlyon.com/geoserver/sytral/ows?SERVICE=WFS&VERSION=2.0.0&request=GetFeature&typename=sytral:tcl_sytral.tcllignemf_2_0_0&outputFormat=application/json&SRSNAME=EPSG:4171&sortBy=gid"; "https://data.grandlyon.com/geoserver/sytral/ows?SERVICE=WFS&VERSION=2.0.0&request=GetFeature&typename=sytral:tcl_sytral.tcllignemf_2_0_0&outputFormat=application/json&SRSNAME=EPSG:4171&sortBy=gid";
let distance = +Infinity;
$: points = 5000 * Math.exp(-distance / 750);
onMount(async () => { onMount(async () => {
const L = (await import("leaflet")).default; const L = (await import("leaflet")).default;
@ -43,16 +46,28 @@
}); });
} }
const marker = L.marker([centerLat, centerLon]); const marker = L.marker([0, 0]);
map.on("click", (e) => marker.setLatLng(e.latlng).addTo(map)); map.on("click", (e) => {
marker.setLatLng(e.latlng).addTo(map);
// allow 20m of error
distance = Math.max(0, e.latlng.distanceTo([45.75388713, 4.84715287]) - 20);
});
}); });
</script> </script>
<div id="info">
<span>distance: {distance}, points: {points}</span>
</div>
<div id="map"></div> <div id="map"></div>
<style> <style>
#info {
height: 5vh;
}
#map { #map {
height: 100vh; height: 95vh;
width: 100%; width: 100%;
} }
</style> </style>