From 4faab772789452e9e4bb831c7d9471877587595d Mon Sep 17 00:00:00 2001 From: Jeff Emmett Date: Wed, 18 Feb 2026 09:47:13 +0000 Subject: [PATCH] fix: auto-center map on user's location instead of Hamburg Trigger GeolocateControl on map load so the map flies to the user's position. Default viewport changed from Hamburg CCH zoom-15 to a world view, so denied geolocation still looks reasonable. Co-Authored-By: Claude Opus 4.6 --- src/components/map/MapView.tsx | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/components/map/MapView.tsx b/src/components/map/MapView.tsx index b1b7c5a..f325791 100644 --- a/src/components/map/MapView.tsx +++ b/src/components/map/MapView.tsx @@ -37,10 +37,10 @@ interface MapViewProps { onClearRoute?: () => void; } -// Default to Hamburg CCH area for CCC events +// Default viewport — geolocation will override on load const DEFAULT_VIEWPORT: MapViewport = { - center: [9.9898, 53.5550], // Hamburg CCH - zoom: 15, + center: [0, 30], // World view; geolocation re-centers automatically + zoom: 2, }; // Validate coordinates are within valid ranges @@ -147,16 +147,14 @@ export default function MapView({ // Add controls map.current.addControl(new maplibregl.NavigationControl(), 'top-right'); - map.current.addControl( - new maplibregl.GeolocateControl({ - positionOptions: { - enableHighAccuracy: true, - }, - trackUserLocation: true, - showUserHeading: true, - } as maplibregl.GeolocateControlOptions), - 'top-right' - ); + const geolocate = new maplibregl.GeolocateControl({ + positionOptions: { + enableHighAccuracy: true, + }, + trackUserLocation: true, + showUserHeading: true, + } as maplibregl.GeolocateControlOptions); + map.current.addControl(geolocate, 'top-right'); map.current.addControl(new maplibregl.ScaleControl(), 'bottom-left'); // Handle click events @@ -166,6 +164,8 @@ export default function MapView({ map.current.on('load', () => { setMapLoaded(true); + // Auto-trigger geolocation to center on user's position + geolocate.trigger(); }); return () => {