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 () => {