- Logik zur Initialisierung und Aktualisierung von Marker-Layern aus MapComponent.js ausgelagert. - Neuer Hook: useDynamicMarkerLayers im hooks-Verzeichnis hinzugefügt. - Modularisierung und Wiederverwendbarkeit verbessert.
81 lines
3.4 KiB
JavaScript
81 lines
3.4 KiB
JavaScript
import { useEffect, useRef } from "react";
|
|
import L from "leaflet";
|
|
import { createAndSetDevices } from "../utils/createAndSetDevices.js";
|
|
import { checkOverlappingMarkers } from "../utils/markerUtils";
|
|
import { plusRoundIcon } from "../components/PlusRoundIcon.js";
|
|
|
|
export const useDynamicMarkerLayers = (
|
|
map,
|
|
gisSystemStaticLoaded,
|
|
GisSystemStatic,
|
|
priorityConfig,
|
|
setMarkerStates
|
|
) => {
|
|
const layerRefs = {
|
|
gmaLayerRef: useRef(null),
|
|
talasLayerRef: useRef(null),
|
|
eciMarkersLayerRef: useRef(null),
|
|
gsmModemMarkersLayerRef: useRef(null),
|
|
ciscoRouterMarkersLayerRef: useRef(null),
|
|
wagoMarkersLayerRef: useRef(null),
|
|
siemensMarkersLayerRef: useRef(null),
|
|
otdrMarkersLayerRef: useRef(null),
|
|
wdmMarkersLayerRef: useRef(null),
|
|
messstellenMarkersLayerRef: useRef(null),
|
|
talasiclMarkersLayerRef: useRef(null),
|
|
dauzMarkersLayerRef: useRef(null),
|
|
smsfunkmodemMarkersLayerRef: useRef(null),
|
|
ulafMarkersLayerRef: useRef(null),
|
|
sonstigeMarkersLayerRef: useRef(null),
|
|
tkComponentsMarkersRef: useRef(null),
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (!gisSystemStaticLoaded || !map) return;
|
|
|
|
const layerGroups = [
|
|
{ ref: layerRefs.gmaLayerRef, id: 11, setState: setMarkerStates.setGmaMarkers },
|
|
{ ref: layerRefs.talasLayerRef, id: 1, setState: setMarkerStates.setTalasMarkers },
|
|
{ ref: layerRefs.eciMarkersLayerRef, id: 2, setState: setMarkerStates.setEciMarkers },
|
|
{ ref: layerRefs.gsmModemMarkersLayerRef, id: 5, setState: setMarkerStates.setGsmModemMarkers },
|
|
{ ref: layerRefs.ciscoRouterMarkersLayerRef, id: 6, setState: setMarkerStates.setCiscoRouterMarkers },
|
|
{ ref: layerRefs.wagoMarkersLayerRef, id: 7, setState: setMarkerStates.setWagoMarkers },
|
|
{ ref: layerRefs.siemensMarkersLayerRef, id: 8, setState: setMarkerStates.setSiemensMarkers },
|
|
{ ref: layerRefs.otdrMarkersLayerRef, id: 9, setState: setMarkerStates.setOtdrMarkers },
|
|
{ ref: layerRefs.wdmMarkersLayerRef, id: 10, setState: setMarkerStates.setWdmMarkers },
|
|
{ ref: layerRefs.messstellenMarkersLayerRef, id: 13, setState: setMarkerStates.setMessstellenMarkers },
|
|
{ ref: layerRefs.talasiclMarkersLayerRef, id: 100, setState: setMarkerStates.setTalasiclMarkers },
|
|
{ ref: layerRefs.dauzMarkersLayerRef, id: 110, setState: setMarkerStates.setDauzMarkers },
|
|
{ ref: layerRefs.smsfunkmodemMarkersLayerRef, id: 111, setState: setMarkerStates.setSmsfunkmodemMarkers },
|
|
{ ref: layerRefs.ulafMarkersLayerRef, id: 0, setState: setMarkerStates.setUlafMarkers },
|
|
{ ref: layerRefs.sonstigeMarkersLayerRef, id: 200, setState: setMarkerStates.setSonstigeMarkers },
|
|
{ ref: layerRefs.tkComponentsMarkersRef, id: 30, setState: setMarkerStates.setTkComponentsMarkers },
|
|
];
|
|
|
|
layerGroups.forEach(({ ref }) => {
|
|
if (!ref.current) {
|
|
ref.current = new L.LayerGroup().addTo(map);
|
|
}
|
|
});
|
|
|
|
const updateMarkers = ({ ref, id, setState }) => {
|
|
if (ref.current) {
|
|
ref.current.clearLayers();
|
|
}
|
|
|
|
createAndSetDevices(id, (newMarkers) => {
|
|
setState(newMarkers);
|
|
newMarkers.forEach((marker) => ref.current.addLayer(marker));
|
|
checkOverlappingMarkers(map, newMarkers, plusRoundIcon);
|
|
}, GisSystemStatic, priorityConfig);
|
|
};
|
|
|
|
const updateAllMarkers = () => {
|
|
layerGroups.forEach(updateMarkers);
|
|
};
|
|
|
|
updateAllMarkers();
|
|
|
|
}, [gisSystemStaticLoaded, map, GisSystemStatic, priorityConfig]);
|
|
};
|