diff --git a/components/MapComponent.js b/components/MapComponent.js
index e9b3e4801..b598ef2a5 100644
--- a/components/MapComponent.js
+++ b/components/MapComponent.js
@@ -84,28 +84,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     setSelectedPoi(poiData); // poiData should be the data of the selected POI
     // Open the modal or any other logic
   };
-  const [lineColor, setLineColor] = useState();
-  //-------------------------------------------linesColorAPI
-  useEffect(() => {
-    const fetchlinesColor = async () => {
-      try {
-        const response = await fetch("/api/linesColorApi");
-        const data = await response.json();
-        console.log("linesColorAPI:", data);
-        data.linesColor.Statis.forEach((item) => {
-          if (item.IdModul === 1) {
-            console.log("item color in if: ", item.Co);
-            setLineColor(item.Co);
-          }
-          //console.log("item color nicht in if: ", item);
-        });
-      } catch (error) {
-        console.error("Fehler beim Abrufen der linesColorApi Daten:", error);
-      }
-    };
-    fetchlinesColor();
-  }, []);
-  //-------------------------------------------
 
   useEffect(() => {
     const params = new URL(window.location.href).searchParams;
@@ -1757,15 +1735,17 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     const toggleLayer = (isVisible) => {
       if (isVisible) {
         talasMarkers.forEach((marker) => marker.addTo(map)); // Ensure markers are added
-        console.log("talasMarkers", talasMarkers);
-        console.log("talasMarkers.color", talasMarkers.color);
-        const polyline = L.polyline(linePositions, { color: lineColor }).addTo(
+        //console.log("talasMarkers", talasMarkers);
+        //console.log("talasMarkers.color", talasMarkers.color);
+        talasMarkers.forEach((marker) => map.removeLayer(marker));
+        /*     const polyline = L.polyline(linePositions, { color: lineColor }).addTo(
           //Linien-Farbe /Farbe für die Strecke zwischen den Markern
           TALAS
-        );
-      } else {
-        talasMarkers.forEach((marker) => map.removeLayer(marker)); // Remove markers individually
+        ); */
       }
+      /*        else {
+        talasMarkers.forEach((marker) => map.removeLayer(marker)); // Remove markers individually
+      } */
     };
 
     // Apply visibility state to the TALAS layer
@@ -2097,11 +2077,36 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   ]);
 
   //LINESTRING (53.151257 8.190471,53.161601 8.129359,53.19802 8.092366,53.244065 8.014003,53.252539 7.954265)
+
+  const [lineColors, setLineColors] = useState({});
+
+  // API-Aufruf, um Farben der Linien abzurufen
+  useEffect(() => {
+    const fetchLinesColor = async () => {
+      try {
+        const response = await fetch("/api/linesColorApi");
+        const data = await response.json();
+        const colorsByModule = {};
+        data.linesColor.Statis.forEach((item) => {
+          colorsByModule[item.IdModul] = item.Co;
+        });
+        setLineColors(colorsByModule);
+      } catch (error) {
+        console.error("Fehler beim Abrufen der linesColorApi Daten:", error);
+      }
+    };
+    fetchLinesColor();
+  }, []);
+
+  // Überwachen des lineColors Zustandes
+  useEffect(() => {
+    console.log("Aktualisierte lineColors", lineColors);
+  }, [lineColors]);
+
   const [linePositions, setLinePositions] = useState([]);
 
   useEffect(() => {
     const endpoint = "/api/readGisLines";
-
     fetch(endpoint)
       .then((response) => {
         if (!response.ok) {
@@ -2110,21 +2115,16 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         return response.json();
       })
       .then((data) => {
-        console.log("readGisLines API Response:", data);
-
-        if (!Array.isArray(data)) {
-          throw new Error("Data is not an array");
-        }
-
         const newLinePositions = data.map((item) => {
           if (item.points && Array.isArray(item.points)) {
-            return item.points.map((point) => [point.x, point.y]);
+            return {
+              coordinates: item.points.map((point) => [point.x, point.y]),
+              idModul: item.idModul,
+            };
           } else {
             throw new Error("Points missing or not an array");
           }
         });
-
-        console.log("Transformed Line Positions:", newLinePositions);
         setLinePositions(newLinePositions);
       })
       .catch((error) => {
@@ -2132,16 +2132,16 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
       });
   }, []);
 
+  // Karte-Linien Zeichnen
   useEffect(() => {
     if (!map) return;
 
-    linePositions.forEach((line) => {
-      if (line.length > 0) {
-        // Create a polyline for each set of coordinates
-        const polyline = L.polyline(line, { color: lineColor }).addTo(map);
+    linePositions.forEach((lineData) => {
+      if (lineData.coordinates.length > 0) {
+        const color = lineColors[lineData.idModul] || "#000000"; // Standardfarbe schwarz, wenn keine Farbe gefunden
+        const polyline = L.polyline(lineData.coordinates, { color }).addTo(map);
 
-        // Add start circle marker
-        L.circleMarker(line[0], {
+        L.circleMarker(lineData.coordinates[0], {
           radius: 5,
           fillColor: "#0000FF",
           color: "#0000FF",
@@ -2150,8 +2150,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
           fillOpacity: 0.8,
         }).addTo(map);
 
-        // Add end circle marker
-        L.circleMarker(line[line.length - 1], {
+        L.circleMarker(lineData.coordinates[lineData.coordinates.length - 1], {
           radius: 5,
           fillColor: "#0000FF",
           color: "#0000FF",
@@ -2160,9 +2159,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
           fillOpacity: 0.8,
         }).addTo(map);
 
-        // Add yellow circle markers for intermediate points
-        for (let i = 1; i < line.length - 1; i++) {
-          L.circleMarker(line[i], {
+        for (let i = 1; i < lineData.coordinates.length - 1; i++) {
+          L.circleMarker(lineData.coordinates[i], {
             radius: 3,
             fillColor: "#FFFF00",
             color: "#FFFF00",
@@ -2173,7 +2171,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
         }
       }
     });
-  }, [map, linePositions]);
+  }, [map, linePositions, lineColors]);
   //---------------------------------------------------------
 
   return (