diff --git a/components/MapComponent.js b/components/MapComponent.js
index 41a4e7442..7a90093ca 100644
--- a/components/MapComponent.js
+++ b/components/MapComponent.js
@@ -15,7 +15,7 @@ import { gisSystemStaticState } from "../store/gisSystemState";
import { mapLayersState } from "../store/mapLayersState";
const MapComponent = ({ locations, onLocationUpdate }) => {
- const dbLayerRef = useRef(null); // Referenz auf die Layer-Gruppe für Datenbank-Marker
+ const poiLayerRef = useRef(null); // Referenz auf die Layer-Gruppe für Datenbank-Marker
const mapRef = useRef(null); // Referenz auf das DIV-Element der Karte
const [map, setMap] = useState(null); // Zustand der Karteninstanz
const [oms, setOms] = useState(null); // State für OMS-Instanz
@@ -552,7 +552,7 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
}, [map]);
//-------------------- // Diese useEffect wird nur beim ersten Rendering oder wenn sich `map` ändert, ausgeführt
// Marker hinzufügen von lokale MySQL Datenbank und nicht von APIs
- useEffect(() => {
+/* useEffect(() => {
// Remove old markers
if (map) {
// Entfernen der alten DBLayer und Erstellung einer neuen
@@ -590,31 +590,31 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
marker.addTo(dbLayer);
});
}
- }, [map, locations, onLocationUpdate]);
+ }, [map, locations, onLocationUpdate]); */
//------------------------------------------
useEffect(() => {
// Initialisierung der dbLayer, wenn die Karte verfügbar ist
- if (map && !dbLayerRef.current) {
- dbLayerRef.current = new L.LayerGroup().addTo(map);
+ if (map && !poiLayerRef.current) {
+ poiLayerRef.current = new L.LayerGroup().addTo(map);
}
return () => {
- if (map && dbLayerRef.current) {
+ if (map && poiLayerRef.current) {
// Entfernen der dbLayer bei Unmount
- map.removeLayer(dbLayerRef.current);
- dbLayerRef.current = null;
+ map.removeLayer(poiLayerRef.current);
+ poiLayerRef.current = null;
}
};
}, [map]); // Dieser Effekt läuft nur, wenn sich `map` ändert
//------------------------------------------
useEffect(() => {
- if (map && dbLayerRef.current) {
+ if (map && poiLayerRef.current) {
// Sicherstellen, dass die alte dbLayer entfernt wird
- map.removeLayer(dbLayerRef.current);
- dbLayerRef.current = new L.LayerGroup().addTo(map);
-
+ map.removeLayer(poiLayerRef.current);
+ poiLayerRef.current = new L.LayerGroup().addTo(map);
+
locations.forEach((location) => {
const { latitude, longitude } = parsePoint(location.position);
const marker = L.marker([latitude, longitude], {
@@ -627,7 +627,20 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
draggable: true,
id: location.idPoi,
});
-
+
+ // Popup binden, aber nicht automatisch öffnen
+ marker.bindPopup(
+ `${location.description || "Unbekannt"}
Type: ${location.idPoiTyp || "N/A"}
Lat: ${latitude.toFixed(5)}, Lng: ${longitude.toFixed(5)}`
+ );
+
+ // Event-Handler für Mouseover und Mouseout hinzufügen
+ marker.on("mouseover", function() {
+ this.openPopup();
+ });
+ marker.on("mouseout", function() {
+ this.closePopup();
+ });
+
marker.on("dragend", function (e) {
const newLat = e.target.getLatLng().lat;
const newLng = e.target.getLatLng().lng;
@@ -636,11 +649,12 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
onLocationUpdate(markerId, newLat, newLng);
});
});
-
- marker.addTo(dbLayerRef.current);
+
+ marker.addTo(poiLayerRef.current);
});
}
}, [map, locations, onLocationUpdate]); // Dieser Effekt läuft, wenn `map`, `locations` oder `onLocationUpdate` sich ändern
+
function parsePoint(position) {
const [longitude, latitude] = position.slice(6, -1).split(" ");
diff --git a/store/mapLayersState.js b/store/mapLayersState.js
index 06a599e29..de2e792a6 100644
--- a/store/mapLayersState.js
+++ b/store/mapLayersState.js
@@ -6,19 +6,19 @@ export const mapLayersState = atom({
default: {
// Standardwerte für jeden Layer
TALAS: true,
- ECI: false,
- ULAF: false,
- GSMModem: false,
- CiscoRouter: false,
- WAGO: false,
- Siemens: false,
- OTDR: false,
- WDM: false,
- GMA: false,
- Messstellen: false,
- TALASICL: false,
- DAUZ: false,
- SMSFunkmodem: false,
- Sonstige: false,
+ ECI: true,
+ ULAF: true,
+ GSMModem: true,
+ CiscoRouter: true,
+ WAGO: true,
+ Siemens: true,
+ OTDR: true,
+ WDM: true,
+ GMA: true,
+ Messstellen: true,
+ TALASICL: true,
+ DAUZ: true,
+ SMSFunkmodem: true,
+ Sonstige: true,
},
});