add: read Gis Lines

components/MapComponent.js

@@ -49,10 +49,6 @@ const plusRoundIcon = L.icon({
 
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const [menuItemAdded, setMenuItemAdded] = useState(false);
-  const linePositions = lineCoordinates || [
-    [52.505, 8],
-    [52, 8.5],
-  ];
 
   const poiLayerVisible = useRecoilValue(poiLayerVisibleState);
 
@@ -157,6 +153,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
 
   const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false);
   const baseUrl = "http://10.10.0.13/talas5/devices/";
+  //const baseUrl = "http://localhost/talas5/devices/";
   const [isPoiTypLoaded, setIsPoiTypLoaded] = useState(false);
   const [poiTypMap, setPoiTypMap] = useState(new Map());
   const [showPopup, setShowPopup] = useState(false);
@@ -2039,6 +2036,51 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     ulafMarkers,
   ]);
 
+  //LINESTRING (53.151257 8.190471,53.161601 8.129359,53.19802 8.092366,53.244065 8.014003,53.252539 7.954265)
+  const [linePositions, setLinePositions] = useState(
+    lineCoordinates || [
+      [52.505, 8],
+      [52, 8.5],
+    ]
+  );
+  //-------------------------------------------------------------------------------------
+  //    GisLines API-Endpoint aufrufen
+  //-----------------------------------------------------
+  useEffect(() => {
+    const endpoint = "/api/readGisLines";
+
+    // Fetch data from the API
+    fetch(endpoint)
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error("Network response was not ok");
+        }
+        return response.json();
+      })
+      .then((data) => {
+        console.log("readGisLines API Response:", data);
+
+        // Check if data is an array and handle it accordingly
+        if (Array.isArray(data)) {
+          // Map over each item to extract the points array
+          const newLinePositions = data.flatMap((item) => {
+            // Check if item.points is available and return the transformed points
+            if (item.points) {
+              return item.points.map((point) => [point.x, point.y]);
+            }
+            return []; // Return an empty array if no points available
+          });
+          console.log("Transformed Line Positions:", newLinePositions);
+
+          // Update state or pass to a function that uses the line positions
+          setLinePositions(newLinePositions);
+        }
+      })
+      .catch((error) => {
+        console.error("readGisLines Error fetching data:", error);
+      });
+  }, []); // Empty dependency array means this runs once on mount
+
   //---------------------------------------------------------
 
   return (