Eigener Standort per Button anwählbar

2025-11-05 11:39:44 +00:00
parent 8e8a6b3b13
commit b07967110e
6 changed files with 88 additions and 2 deletions
@@ -53,3 +53,52 @@ const buildMarkers = async (params, mapparams) => {
 export const setNewCenter = (center) => {
    mapparams.map.setView(center)
 }
+
+export const goToMyLocation = () => {
+    if (!navigator.geolocation) {
+        alert('Geolocation wird von diesem Browser nicht unterstützt');
+        return;
+    }
+
+    navigator.geolocation.getCurrentPosition(
+        (position) => {
+            const lat = position.coords.latitude;
+            const lon = position.coords.longitude;
+            const accuracy = position.coords.accuracy;
+            
+            // Karte zur aktuellen Position zentrieren
+            mapparams.map.setView([lat, lon], 15);
+            
+            // Optional: Marker an aktueller Position setzen
+            const myLocationMarker = L.marker([lat, lon], {
+                icon: L.icon({
+                    iconUrl: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCI+PGNpcmNsZSBjeD0iMjAiIGN5PSIyMCIgcj0iOCIgZmlsbD0iIzQyODVGNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIzIi8+PGNpcmNsZSBjeD0iMjAiIGN5PSIyMCIgcj0iMTUiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQyODVGNCIgc3Ryb2tlLXdpZHRoPSIyIiBvcGFjaXR5PSIwLjMiLz48L3N2Zz4=',
+                    iconSize: [40, 40],
+                    iconAnchor: [20, 20]
+                })
+            }).addTo(mapparams.map);
+            
+            myLocationMarker.bindPopup(`📍 Ihr Standort<br/>Genauigkeit: ±${Math.round(accuracy)}m`).openPopup();
+        },
+        (error) => {
+            let errorMsg = 'Position konnte nicht ermittelt werden.';
+            switch(error.code) {
+                case error.PERMISSION_DENIED:
+                    errorMsg = 'Bitte erlauben Sie den Zugriff auf Ihren Standort.';
+                    break;
+                case error.POSITION_UNAVAILABLE:
+                    errorMsg = 'Standortinformationen sind nicht verfügbar.';
+                    break;
+                case error.TIMEOUT:
+                    errorMsg = 'Die Anfrage ist abgelaufen.';
+                    break;
+            }
+            alert(errorMsg);
+        },
+        {
+            enableHighAccuracy: true,
+            timeout: 5000,
+            maximumAge: 0
+        }
+    );
+}