Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(map): entferne Start-, End- und Stützpunkt-Icons sofort beim Ausblenden der Kabelstrecken

Browse Source 
- Alle Marker mit StartIcon, EndIcon und CircleIcon werden jetzt direkt entfernt, wenn die Kabelstrecken-Checkbox deaktiviert wird
- Kein Browser-Reload mehr nötig, Icons verschwinden sofort von der Karte
This commit is contained in:
ISA
2025-08-22 10:12:03 +02:00
parent f2a322a91b
commit a013c07394
5 changed files with 62 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
components/mainComponent/MapComponent.js
View File

@@ -10,6 +10,9 @@ import { InformationCircleIcon } from "@heroicons/react/20/solid";
import PoiUpdateModal from "@/components/pois/poiUpdateModal/PoiUpdateModal.js";
import { ToastContainer, toast } from "react-toastify";
import plusRoundIcon from "../icons/devices/overlapping/PlusRoundIcon.js";
import StartIcon from "@/components/gisPolylines/icons/StartIcon.js";
import EndIcon from "@/components/gisPolylines/icons/EndIcon.js";
import CircleIcon from "@/components/gisPolylines/icons/CircleIcon.js";
import { restoreMapSettings, checkOverlappingMarkers } from "../../utils/mapUtils.js";
import addItemsToMapContextMenu from "@/components/contextmenu/useMapContextMenu.js";
@@ -234,41 +237,62 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
// URL-Parameter extrahieren und kartenspezifische localStorage-Keys verwenden
useEffect(() => {
const params = new URLSearchParams(window.location.search);
const mapId = params.get("m");
const userId = params.get("u");
if (mapId && userId) {
// Speichere aktuelle Map- und User-ID
localStorage.setItem("currentMapId", mapId);
localStorage.setItem("currentUserId", userId);
// Kartenspezifischer localStorage-Key
const mapStorageKey = `mapLayersVisibility_m${mapId}_u${userId}`;
const storedMapLayersVisibility = localStorage.getItem(mapStorageKey);
if (storedMapLayersVisibility) {
try {
const parsedVisibility = JSON.parse(storedMapLayersVisibility);
Object.keys(parsedVisibility).forEach(key => {
dispatch(setLayerVisibility({ layer: key, visibility: parsedVisibility[key] }));
});
console.log(
`🔄 mapLayersVisibility für Map ${mapId}/User ${userId} geladen:`,
parsedVisibility
);
} catch (error) {
console.error("❌ Fehler beim Laden von mapLayersVisibility:", error);
}
} else {
console.log(
`📝 Keine gespeicherten Einstellungen für Map ${mapId}/User ${userId} gefunden`
);
// Immer beim Umschalten der Kabelstrecken-Checkbox prüfen!
if (map) {
if (!polylineVisible) {
map.eachLayer(layer => {
// Entferne alle Marker mit StartIcon, EndIcon oder CircleIcon (Stützpunkt)
if (
layer instanceof L.Marker &&
layer.options &&
layer.options.icon &&
(layer.options.icon === StartIcon ||
layer.options.icon === EndIcon ||
layer.options.icon === CircleIcon)
) {
map.removeLayer(layer);
}
});
}
// Redux Polyline Sichtbarkeit initialisieren (map/user spezifisch)
dispatch(initializePolylineFromLocalStorageThunk());
}
}, [dispatch]); // Nur einmal beim Mount ausführen
// Initialisierung der Layer-Visibility und Polyline-Redux-State nur beim Mount
if (typeof window !== "undefined") {
const params = new URLSearchParams(window.location.search);
const mapId = params.get("m");
const userId = params.get("u");
if (mapId && userId) {
// Speichere aktuelle Map- und User-ID
localStorage.setItem("currentMapId", mapId);
localStorage.setItem("currentUserId", userId);
// Kartenspezifischer localStorage-Key
const mapStorageKey = `mapLayersVisibility_m${mapId}_u${userId}`;
const storedMapLayersVisibility = localStorage.getItem(mapStorageKey);
if (storedMapLayersVisibility) {
try {
const parsedVisibility = JSON.parse(storedMapLayersVisibility);
Object.keys(parsedVisibility).forEach(key => {
dispatch(setLayerVisibility({ layer: key, visibility: parsedVisibility[key] }));
});
console.log(
`🔄 mapLayersVisibility für Map ${mapId}/User ${userId} geladen:`,
parsedVisibility
);
} catch (error) {
console.error("❌ Fehler beim Laden von mapLayersVisibility:", error);
}
} else {
console.log(
`📝 Keine gespeicherten Einstellungen für Map ${mapId}/User ${userId} gefunden`
);
}
// Redux Polyline Sichtbarkeit initialisieren (map/user spezifisch)
dispatch(initializePolylineFromLocalStorageThunk());
}
}
}, [dispatch, polylineVisible, map]);
useEffect(() => {
if (linesData && Array.isArray(linesData)) {
const transformed = linesData.map(item => ({