<input name="layer" type="radio" onclick="show('https://static.righto.com/images/386-package/layer0.jpg')" id="layer1">
<label for="layer1">Pins</label>
then it would be possible to click the label name (i.e. Pins, I/O Vcc, etc.) instead of having to click the small radio circles.It's a small thing, but I think it's a lot more fun/easy/fast to click the different label names rather than the circles. It's truly a small nit - just in case it's an easy fix for you. Cheers!
(just to make sure: you need to add a unique "id" attribute for each "input", and then make a <label> tag for each label referencing that id in the "for")
I know that you deeply know map tech :-) but if I may make a suggestion - you might consider switching from Google Maps to Protomaps? https://github.com/protomaps/protomaps-leaflet
Cheers
const { latitude = "0", longitude = "0" } = Astro.locals.runtime.cf || {};
I gather you're using some cloudflare feature wrapped in astro to provide lat/long but I don't see the actual plumbing that gets it to you (and I did try to spelunk through a decent amount of documentation to find it). Can you elaborate?https://developers.cloudflare.com/network/ip-geolocation/
"This Managed Transform adds HTTP request headers with location information for the visitor's IP address, such as city, country, continent, longitude, and latitude."
And this version combining the graphic and the sound used to make the graphic: https://www.youtube.com/watch?v=abapFJN6glo
And this alternative version (h/t @Kye): https://www.youtube.com/watch?v=jpMrTxMV6E4