initial Marker werden wie erwartet auf die Karte gezeichnet, aber Plus Icon wird sich nicht aktualisiert, es muss dafür die Seite neu geladen wird

components/MapComponent.js

@@ -180,7 +180,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     setUserId(params.get("u"));
   }, [setMapId, setUserId]);
 
-  useEffect(() => {
+  /*   useEffect(() => {
     if (map && poiLayerRef.current && isPoiTypLoaded && !menuItemAdded && isRightsLoaded) {
       //console.log("Überprüfung der Berechtigung vor addItemsToMapContextMenu: ", hasRights);
       addItemsToMapContextMenu(hasRights);
@@ -192,7 +192,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     menuItemAdded, // Hinzufügen zu den Abhängigkeiten, um den Effekt korrekt zu steuern
     hasRights, // Sicherstellen, dass hasRights berücksichtigt wird
     isRightsLoaded, // Überprüfung, ob die Rechte geladen sind
-  ]);
+  ]); */
 
   useEffect(() => {
     const fetchAndSetUserRights = async () => {
@@ -270,8 +270,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, []);
 
   //--------------------------------------------------------
-  useDrawLines(setLinePositions);
+  useDrawLines(setLinePositions); // Linien auf die Karte zeichnen
   //--------------------------------------------
+  // POIs Popup Informationen anzeigen
   useEffect(() => {
     const fetchPoiTypData = async () => {
       try {
@@ -284,7 +285,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         console.error("Fehler beim Abrufen der poiTyp-Daten-1:", error);
       }
     };
-    //--------------------------------------------
     const fetchPoiData = async () => {
       try {
         const response = await fetch("/api/talas_v5_DB/pois/poi-icons");
@@ -296,13 +296,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         console.error("Fehler beim Abrufen der poiData-2:", error);
       }
     };
-    //--------------------------------------------
 
     fetchPoiTypData();
     fetchPoiData();
   }, []);
+  //--------------------------------------------
 
-  useEffect(() => {
+  /*   useEffect(() => {
     if (map) {
       const dbLayer = new L.LayerGroup().addTo(map); // Define dbLayer here
 
@@ -310,8 +310,9 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         dbLayer.remove();
       };
     }
-  }, [map]);
+  }, [map]); */
-
+  //--------------------------------------------
+  // POIs auf die Karte zeichnen
   useEffect(() => {
     if (map && !poiLayerRef.current) {
       poiLayerRef.current = new L.LayerGroup().addTo(map);
@@ -328,6 +329,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, [map, locations, poiReadTrigger]);
 
   //--------------------------------------------
+  // POIs auf die Karte zeichnen
   useEffect(() => {
     if (poiData.length === 0) return;
 
@@ -400,22 +402,30 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
       ];
 
       const editMode = localStorage.getItem("editMode") === "true"; // EditMode prüfen
+      const mapLayersVisibility = JSON.parse(localStorage.getItem("mapLayersVisibility")) || {};
 
-      if (editMode) {
+      allMarkers.forEach((marker) => {
-        // Alle Marker entfernen, wenn EditMode aktiv ist
+        // Prüfe, ob der Marker einer sichtbaren Layer-Gruppe zugeordnet ist
-        allMarkers.forEach((marker) => {
+        const layerKey = marker.options?.layerKey; // Layer-Key aus den Optionen des Markers
+        const isVisible = mapLayersVisibility[layerKey];
+
+        if (!layerKey || isVisible === undefined) {
+          console.warn(`Marker ohne gültigen layerKey oder keine Sichtbarkeitsdaten: ${marker}`);
+          return;
+        }
+
+        if (editMode || !isVisible) {
+          // Entferne Marker, wenn EditMode aktiv ist oder Layer unsichtbar
           if (map.hasLayer(marker)) {
             map.removeLayer(marker);
           }
-        });
+        } else {
-      } else {
+          // Füge Marker hinzu, wenn EditMode deaktiviert ist und Layer sichtbar
-        // Marker wieder hinzufügen, falls EditMode deaktiviert ist
-        allMarkers.forEach((marker) => {
           if (!map.hasLayer(marker)) {
             marker.addTo(map);
           }
-        });
+        }
-      }
+      });
 
       // Überprüfe überlappende Marker und füge das "Plus"-Icon hinzu
       checkOverlappingMarkers(map, allMarkers, plusRoundIcon);