Linien färben über lokale4 API, in Talas API ist nur #fffffff farbe, deswegen die lokale API-Endpoint (linesColorApi.js)

This commit is contained in:
ISA
2024-06-24 10:51:38 +02:00
parent 04333fc402
commit d640ef3171
5 changed files with 66 additions and 11 deletions

View File

@@ -36,6 +36,7 @@ import "react-toastify/dist/ReactToastify.css";
import { mapIdState, userIdState } from "../store/atoms/urlParameterState";
import { set } from "lodash";
import { poiLayerVisibleState } from "../store/atoms/poiLayerVisible";
import { data } from "autoprefixer";
//import { createRoot } from "react-dom/client";
@@ -773,7 +774,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
//`${serverURL}/api/rights?idMap=${c}&idUser=${user}`
);
const data = await response.json();
console.log("Benutzerrechte:", data);
//console.log("Benutzerrechte:", data);
const rightsArray = data.Rights; // Nehmen an, dass 'Rights' das Array von Rechten ist
// Speichert die IDs der Rechte in einem Array
@@ -1143,7 +1144,10 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
throw new Error(data.error || "Gerät nicht gefunden");
}
} catch (error) {
console.error("Fehler beim Abrufen des Gerätenamens:", error);
console.error(
"Fehler beim Abrufen des Gerätenamens in MapComponent.js:",
error
);
return "Unbekannt";
}
};
@@ -1204,8 +1208,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
}
const data = await response.json();
setPoiData(data);
console.log("poiData data:", data);
console.log("poiData icons:", poiData);
//console.log("poiData data:", data);
//console.log("poiData icons:", poiData);
} catch (error) {
console.error("Fehler beim Abrufen der poiData:", error);
}
@@ -2098,23 +2102,68 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
const [lineColors, setLineColors] = useState({});
// API-Aufruf, um Farben der Linien abzurufen
useEffect(() => {
/* useEffect(() => {
const fetchLinesColor = async () => {
try {
const response = await fetch(webserviceGisLinesStatusUrl);
const response = await fetch(webserviceGisLinesStatusUrl); //in config.js definiert
const data = await response.json();
//console.log("data.Statis: ", data);
const colorsByModule = {};
data.Statis.forEach((item) => {
colorsByModule[item.Modul] = item.PrioColor;
console.log(
"item.Modul",
item.Modul,
"item.PrioColor",
item.PrioColor,
"item.IdLD",
item.IdLD
);
});
setLineColors(colorsByModule);
//console.log("colorsByModule", colorsByModule);
console.log("colorsByModule", colorsByModule);
} catch (error) {
console.error("Fehler beim Abrufen der linesColorApi Daten:", error);
}
};
fetchLinesColor();
}, []); */
useEffect(() => {
const fetchData = async () => {
try {
const response1 = await fetch(webserviceGisLinesStatusUrl);
const data1 = await response1.json();
const response2 = await fetch("/api/talas_v5_DB/gisLines/readGisLines");
const data2 = await response2.json();
const colorsByModule = {};
data1.Statis.forEach((stat) => {
const matchingLine = data2.find(
(item) => item.idLD === stat.IdLD && item.idModul === stat.Modul
);
if (matchingLine) {
colorsByModule[matchingLine.idModul] = stat.PrioColor;
console.log("Übereinstimmung gefunden für", stat);
console.log(
"stat color",
stat.PrioColor,
"matchingLine",
matchingLine.idModul
);
setLineColors(colorsByModule);
console.log("colorsByModule: ", colorsByModule);
console.log("lineColors: ", lineColors);
} else {
//console.log("Keine Übereinstimmung gefunden für", stat);
}
});
} catch (error) {
console.error("Error fetching data:", error);
}
};
fetchData();
}, []);
// Überwachen des lineColors Zustandes