diff --git a/utils/createAndSetDevices.js b/utils/createAndSetDevices.js index 00bf77c62..9061a57da 100644 --- a/utils/createAndSetDevices.js +++ b/utils/createAndSetDevices.js @@ -66,7 +66,9 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste const getIdSystemAndAllowValueMap = new Map(GisSystemStatic.map((system) => [system.IdSystem, system.Allow])); if (jsonResponse.Points && statusResponse.Statis) { - const statisMap = new Map(statusResponse.Statis.map((s) => [s.IdLD, s])); + const statisMap = new Map(statusResponse.Statis.map((s) => [s.IdLD, { color: s.Co, level: s.Le }])); + + console.log("idLD , Farbe und Level: ", statisMap); let markersData = jsonResponse.Points.filter((station) => station.System === systemId && getIdSystemAndAllowValueMap.get(station.System) === 1).map((station) => { // Statusdaten für die Station abrufen @@ -79,20 +81,17 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste const color = getColorClass(minLevel); // Farbe anhand des Levels console.log(`Station: ${station.LD_Name}, Min Level: ${minLevel}, Color: ${color}`); - - // **CSS-Filter für dynamische Einfärbung des Icons** - const outerColor = "rgba(255, 0, 0, 0.7)"; // Rot mit 70% Deckkraft + const statisData = statisMap.get(station.IdLD); // Hole Farbe und Level + const outerColor = statisData ? statisData.color : "#008013"; // Dynamische Farbe oder Standard-Grün const innerColor = "rgba(255, 255, 255, 0.8)"; // Weiß mit 80% Deckkraft + const marker = L.marker([station.X, station.Y], { icon: L.divIcon({ className: `custom-marker`, html: ` -
+
- + @@ -100,16 +99,15 @@ export const createAndSetDevices = async (systemId, setMarkersFunction, GisSyste - - + + + " />
`, iconSize: [30, 45], iconAnchor: [12, 41],