Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: die Icons werden nicht mehr doppelt angezeigt mit Plus Icon für überlappende Icons

Browse Source
This commit is contained in:
ISA
2024-11-28 10:40:04 +01:00
parent 867322e2b7
commit a9ae56d0ea
1 changed files with 187 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

241
components/MapComponent.js
View File

@@ -392,6 +392,7 @@ await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStat
//console.log("priorityConfig in MapComponent2: ", priorityConfig);
useEffect(() => {
if (gisSystemStaticLoaded && map) {
/* damit nich doppelt vorkommen
createAndSetDevices(11, setGmaMarkers, GisSystemStatic, priorityConfig); // GMA-System
createAndSetDevices(1, setTalasMarkers, GisSystemStatic, priorityConfig); // TALAS-System
createAndSetDevices(2, setEciMarkers, GisSystemStatic, priorityConfig); // ECI-System
@@ -408,6 +409,7 @@ await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStat
createAndSetDevices(111, setSmsfunkmodemMarkers, GisSystemStatic, priorityConfig); // SMS-Funkmodem-System
createAndSetDevices(200, setSonstigeMarkers, GisSystemStatic, priorityConfig); // Sonstige-System
createAndSetDevices(0, setUlafMarkers, GisSystemStatic, priorityConfig); // ULAF-System
*/
}
}, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
@@ -466,9 +468,8 @@ await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStat
...sonstigeMarkers,
...ulafMarkers,
];
// Überprüfe überlappende Marker und füge das "Plus"-Icon hinzu
checkOverlappingMarkers(map, allMarkers, plusRoundIcon);
// checkOverlappingMarkers(map, allMarkers, plusRoundIcon);
}
}, [map, talasMarkers, eciMarkers, gsmModemMarkers, ciscoRouterMarkers, wagoMarkers, siemensMarkers, otdrMarkers, wdmMarkers, gmaMarkers, messstellenMarkers, talasiclMarkers, dauzMarkers, smsfunkmodemMarkers, sonstigeMarkers, ulafMarkers]);
@@ -716,62 +717,102 @@ await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStat
*/
//---------------------------------
const markerLayerRef = useRef(null);
/**
createAndSetDevices(11, setGmaMarkers, GisSystemStatic, priorityConfig); // GMA-System
createAndSetDevices(1, setTalasMarkers, GisSystemStatic, priorityConfig); // TALAS-System
createAndSetDevices(2, setEciMarkers, GisSystemStatic, priorityConfig); // ECI-System
createAndSetDevices(5, setGsmModemMarkers, GisSystemStatic, priorityConfig); // GSM-Modem-System---LTE Modem und GSM Modem sind gleich
//createAndSetDevices(5, setLteModemMarkers, GisSystemStatic, priorityConfig); //LTE Modem----------LTE Modem und GSM Modem sind gleich
createAndSetDevices(6, setCiscoRouterMarkers, GisSystemStatic, priorityConfig); // Cisco-Router-System
createAndSetDevices(7, setWagoMarkers, GisSystemStatic, priorityConfig); // WAGO-System
createAndSetDevices(8, setSiemensMarkers, GisSystemStatic, priorityConfig); // Siemens-System
createAndSetDevices(9, setOtdrMarkers, GisSystemStatic, priorityConfig); // OTDR-System
createAndSetDevices(10, setWdmMarkers, GisSystemStatic, priorityConfig); // WDM-System
createAndSetDevices(13, setMessstellenMarkers, GisSystemStatic, priorityConfig); // Messstellen-System
createAndSetDevices(100, setTalasiclMarkers, GisSystemStatic, priorityConfig); // TALASICL-System
createAndSetDevices(110, setDauzMarkers, GisSystemStatic, priorityConfig); // DAUZ-System
createAndSetDevices(111, setSmsfunkmodemMarkers, GisSystemStatic, priorityConfig); // SMS-Funkmodem-System
createAndSetDevices(200, setSonstigeMarkers, GisSystemStatic, priorityConfig); // Sonstige-System
createAndSetDevices(0, setUlafMarkers, GisSystemStatic, priorityConfig); // ULAF-System
*/
const gmaLayerRef = useRef(null);
const talasLayerRef = useRef(null);
const eciMarkersLayerRef = useRef(null);
const gsmModemMarkersLayerRef = useRef(null);
const ciscoRouterMarkersLayerRef = useRef(null);
const wagoMarkersLayerRef = useRef(null);
const siemensMarkersLayerRef = useRef(null);
const otdrMarkersLayerRef = useRef(null);
const wdmMarkersLayerRef = useRef(null);
const messstellenMarkersLayerRef = useRef(null);
const talasiclMarkersLayerRef = useRef(null);
const dauzMarkersLayerRef = useRef(null);
const smsfunkmodemMarkersLayerRef = useRef(null);
const ulafMarkersLayerRef = useRef(null);
const sonstigeMarkersLayerRef = useRef(null);
useEffect(() => {
if (!gisSystemStaticLoaded || !map) return; // Sicherstellen, dass alle Abhängigkeiten geladen sind
// Initialisiere die LayerGroup, falls noch nicht vorhanden
if (!markerLayerRef.current) {
markerLayerRef.current = new L.LayerGroup().addTo(map);
// Initialisiere die LayerGroups, falls noch nicht vorhanden
if (!gmaLayerRef.current) {
gmaLayerRef.current = new L.LayerGroup().addTo(map);
}
const updateMarkers = () => {
// Alte Marker entfernen
markerLayerRef.current.clearLayers();
// Neue Marker für jedes System erstellen
/* createAndSetDevices(11, (markers) => {
setGmaMarkers(markers);
markers.forEach((marker) => marker.addTo(markerLayerRef.current)); // Marker zur LayerGroup hinzufügen
}, GisSystemStatic, priorityConfig);
*/
createAndSetDevices(11, setGmaMarkers, GisSystemStatic, priorityConfig);
// Füge hier weitere `createAndSetDevices`-Aufrufe für andere Systeme ein
};
// Initiales Update der Marker
updateMarkers();
// Setze ein Intervall, um die Marker alle 10 Sekunden zu aktualisieren
const intervalId = setInterval(() => {
updateMarkers();
}, 10000); // 10 Sekunden
// Aufräumen bei Komponentenentladung
return () => {
clearInterval(intervalId);
if (markerLayerRef.current) {
markerLayerRef.current.clearLayers();
}
};
}, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
//---------------------------------------
const talasLayerRef = useRef(null); // LayerGroup für TALAS
useEffect(() => {
if (!gisSystemStaticLoaded || !map) return; // Sicherstellen, dass alle Abhängigkeiten geladen sind
// Initialisiere die LayerGroup für TALAS, falls noch nicht vorhanden
if (!talasLayerRef.current) {
talasLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!eciMarkersLayerRef.current) {
eciMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!gsmModemMarkersLayerRef.current) {
gsmModemMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!ciscoRouterMarkersLayerRef.current) {
ciscoRouterMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!wagoMarkersLayerRef.current) {
wagoMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!siemensMarkersLayerRef.current) {
siemensMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!otdrMarkersLayerRef.current) {
otdrMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!wdmMarkersLayerRef.current) {
wdmMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!messstellenMarkersLayerRef.current) {
messstellenMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!talasiclMarkersLayerRef.current) {
talasiclMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!dauzMarkersLayerRef.current) {
dauzMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!smsfunkmodemMarkersLayerRef.current) {
smsfunkmodemMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!ulafMarkersLayerRef.current) {
ulafMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
if (!sonstigeMarkersLayerRef.current) {
sonstigeMarkersLayerRef.current = new L.LayerGroup().addTo(map);
}
const updateGmaMarkers = () => {
// Alte Marker entfernen
gmaLayerRef.current.clearLayers();
// Neue Marker für jedes System erstellen
createAndSetDevices(11, setGmaMarkers, GisSystemStatic, priorityConfig);
};
const updateTalasMarkers = () => {
// Alte Marker aus der LayerGroup entfernen
talasLayerRef.current.eachLayer((layer) => {
talasLayerRef.current.removeLayer(layer);
});
talasLayerRef.current.clearLayers();
// Neue Marker hinzufügen
createAndSetDevices(
@@ -779,29 +820,121 @@ await fetchGisStationsStatusDistrict(mapGisStationsStatusDistrictUrl, setGisStat
(newMarkers) => {
setTalasMarkers(newMarkers); // Update State
newMarkers.forEach((marker) => talasLayerRef.current.addLayer(marker)); // Füge Marker zur LayerGroup hinzu
// Überprüfe auf überlappende Marker und füge das Plus-Icon hinzu
checkOverlappingMarkers(map, newMarkers, plusRoundIcon);
},
GisSystemStatic,
priorityConfig
);
};
// Initiales Update
updateTalasMarkers();
const updateEciMarkers = () => {
eciMarkersLayerRef.current.clearLayers();
createAndSetDevices(2, setEciMarkers, GisSystemStatic, priorityConfig);
};
// Setze ein Intervall, um die TALAS-Marker alle 10 Sekunden zu aktualisieren
const intervalId = setInterval(() => {
const updateGsmModemMarkers = () => {
gsmModemMarkersLayerRef.current.clearLayers();
createAndSetDevices(5, setGsmModemMarkers, GisSystemStatic, priorityConfig);
};
const updateCiscoRouterMarkers = () => {
ciscoRouterMarkersLayerRef.current.clearLayers();
createAndSetDevices(6, setCiscoRouterMarkers, GisSystemStatic, priorityConfig);
};
const updateWagoMarkers = () => {
wagoMarkersLayerRef.current.clearLayers();
createAndSetDevices(7, setWagoMarkers, GisSystemStatic, priorityConfig);
};
const updateSiemensMarkers = () => {
siemensMarkersLayerRef.current.clearLayers();
createAndSetDevices(8, setSiemensMarkers, GisSystemStatic, priorityConfig);
};
const updateOtdrMarkers = () => {
otdrMarkersLayerRef.current.clearLayers();
createAndSetDevices(9, setOtdrMarkers, GisSystemStatic, priorityConfig);
};
const updateWdmMarkers = () => {
wdmMarkersLayerRef.current.clearLayers();
createAndSetDevices(10, setWdmMarkers, GisSystemStatic, priorityConfig);
};
const updateMessstellenMarkers = () => {
messstellenMarkersLayerRef.current.clearLayers();
createAndSetDevices(13, setMessstellenMarkers, GisSystemStatic, priorityConfig);
};
const updateTalasiclMarkers = () => {
talasiclMarkersLayerRef.current.clearLayers();
createAndSetDevices(100, setTalasiclMarkers, GisSystemStatic, priorityConfig);
};
const updateDauzMarkers = () => {
dauzMarkersLayerRef.current.clearLayers();
createAndSetDevices(110, setDauzMarkers, GisSystemStatic, priorityConfig);
};
const updateSmsfunkmodemMarkers = () => {
smsfunkmodemMarkersLayerRef.current.clearLayers();
createAndSetDevices(111, setSmsfunkmodemMarkers, GisSystemStatic, priorityConfig);
};
const updateUlafMarkers = () => {
ulafMarkersLayerRef.current.clearLayers();
createAndSetDevices(0, setUlafMarkers, GisSystemStatic, priorityConfig);
};
const updateSonstigeMarkers = () => {
sonstigeMarkersLayerRef.current.clearLayers();
createAndSetDevices(200, setSonstigeMarkers, GisSystemStatic, priorityConfig);
};
// Initiales Update für beide LayerGroups
updateGmaMarkers();
updateTalasMarkers();
updateEciMarkers();
updateGsmModemMarkers();
updateCiscoRouterMarkers();
updateWagoMarkers();
updateSiemensMarkers();
updateOtdrMarkers();
updateWdmMarkers();
updateMessstellenMarkers();
updateTalasiclMarkers();
updateDauzMarkers();
updateSmsfunkmodemMarkers();
updateUlafMarkers();
updateSonstigeMarkers();
// Setze Intervalle für regelmäßige Updates
const markerIntervalId = setInterval(() => {
updateGmaMarkers();
}, 18000); // 18 Sekunden
const talasIntervalId = setInterval(() => {
updateTalasMarkers();
}, 10000); // 10 Sekunden
}, 20000); // 20 Sekunden
// Aufräumen bei Komponentenentladung
return () => {
clearInterval(intervalId);
clearInterval(markerIntervalId);
clearInterval(talasIntervalId);
if (gmaLayerRef.current) {
gmaLayerRef.current.clearLayers();
}
if (talasLayerRef.current) {
talasLayerRef.current.clearLayers();
}
};
}, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
//---------------------------------------
//----------------------------------
//---------------------------------------