diff --git a/components/MapComponent.js b/components/MapComponent.js index 65afab0d2..a214771b0 100644 --- a/components/MapComponent.js +++ b/components/MapComponent.js @@ -81,7 +81,11 @@ import useMapContextMenu from "./useMapContextMenu.js"; //--------------------------------------------------------------------- //-------------------- MapComponent ----------------------------------- const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { - const [currentZoom, setCurrentZoom] = useState(12); + const [currentZoom, setCurrentZoom] = useState(() => { + const storedZoom = localStorage.getItem("mapZoom"); + return storedZoom ? parseInt(storedZoom, 10) : 12; + }); + const [currentCenter, setCurrentCenter] = useState(() => { const storedCenter = localStorage.getItem("mapCenter"); try { @@ -242,10 +246,15 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const zoomIn = (e) => { initMap.flyTo(e.latlng, 12); //console.log("ZoomIn koordinaten in MapComponent", e.latlng); + // Speichern der Daten in LocalStorage + localStorage.setItem("mapZoom", map.getZoom()); + localStorage.setItem("mapCenter", JSON.stringify(map.getCenter())); }; const zoomOut = (e) => { fly(); + localStorage.setItem("mapZoom", map.getZoom()); + localStorage.setItem("mapCenter", JSON.stringify(map.getCenter())); }; const centerHere = (e) => { initMap.panTo(e.latlng); @@ -2072,8 +2081,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { insertNewMarker(closestPoints, newPoint, lineData, map); redrawPolyline(lineData); //Browser aktualisieren - localStorage.setItem("mapZoom", currentZoom); - localStorage.setItem("mapCenter", JSON.stringify(currentCenter)); + //localStorage.setItem("mapZoom", currentZoom); + //localStorage.setItem("mapCenter", JSON.stringify(currentCenter)); window.location.reload(); }, }, diff --git a/utils/markerUtils.js b/utils/markerUtils.js index cac0e98c3..ddf47e3cb 100644 --- a/utils/markerUtils.js +++ b/utils/markerUtils.js @@ -20,6 +20,7 @@ export const insertNewMarker = (closestPoints, newPoint, lineData, map) => { // Event-Listener für das Verschieben des Markers hinzufügen newMarker.on("dragend", () => { const newCoords = newMarker.getLatLng(); + setNewCoords(newCoords); const newCoordinates = [...lineData.coordinates]; newCoordinates[closestPoints[2]] = [newCoords.lat, newCoords.lng]; lineData.coordinates = newCoordinates; @@ -66,8 +67,8 @@ export const handleEditPoi = ( export const removeMarker = (marker, lineData, currentZoom, currentCenter) => { // Save zoom and center to localStorage - localStorage.setItem("mapZoom", currentZoom); - localStorage.setItem("mapCenter", JSON.stringify(currentCenter)); + //localStorage.setItem("mapZoom", currentZoom); + //localStorage.setItem("mapCenter", JSON.stringify(currentCenter)); // Find the index of the coordinate that matches the marker's position const index = lineData.coordinates.findIndex((coord) =>