Add reverse geocoding lookup and display

This commit is contained in:
Eli Ribble 2026-01-09 04:06:37 +00:00
parent b4e91609d3
commit 9680fb6a68
No known key found for this signature in database

View file

@ -25,6 +25,7 @@ function onMapMarkerDragEnd(marker) {
return function() {
const lngLat = marker.getLngLat();
displaySelectedCoordinates(lngLat);
reverseGeocode(lngLat);
}
}
function displaySelectedCoordinates(lngLat) {
@ -33,6 +34,19 @@ function displaySelectedCoordinates(lngLat) {
longitude.textContent = lngLat.lng;
latitude.textContent = lngLat.lat;
}
async function reverseGeocode(lngLat) {
const MAPBOX_ACCESS_TOKEN = '{{.MapboxToken}}';
const url = `https://api.mapbox.com/search/geocode/v6/reverse?longitude=${lngLat.lng}&latitude=${lngLat.lat}&access_token=${MAPBOX_ACCESS_TOKEN}`
const response = await fetch(url);
const data = await response.json();
console.log("reverse geocoded to", data);
if (data.features.length == 0) {
console.warn("No results for reverse geocode");
return;
}
const match = data.features[0];
displaySelectedLocation(match);
}
function onLoadMap() {
const MAPBOX_ACCESS_TOKEN = '{{.MapboxToken}}';
console.log("Setting up the map...");