diff --git a/components/MapComponent.js b/components/MapComponent.js
index 954ba0561..8687e9262 100644
--- a/components/MapComponent.js
+++ b/components/MapComponent.js
@@ -780,7 +780,17 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
//---------------------------------------
// Initialisiere Leaflet-Karte
// Rufe useBereicheMarkersLayer direkt auf
- const bereicheMarkers = useBereicheMarkersLayer(map, oms, "/api/talas_v5_DB/bereich/readBereich?m=12");
+ const [bereichUrl, setBereichUrl] = useState(null);
+
+ useEffect(() => {
+ const urlParams = new URLSearchParams(window.location.search); // URL-Parameter parsen
+ const mValue = urlParams.get("m"); // Wert von "m" holen
+ setBereichUrl(`/api/talas_v5_DB/bereich/readBereich?m=${mValue || 12}`); // Fallback auf 12, falls "m" nicht definiert ist
+ }, []);
+
+ // Bereichs-Marker basierend auf dynamischer URL laden
+ const bereicheMarkers = useBereicheMarkersLayer(map, oms, bereichUrl);
+ //const bereicheMarkers = useBereicheMarkersLayer(map, oms, "/api/talas_v5_DB/bereich/readBereich?m=12");
/* useEffect(() => {
if (map && oms) {
diff --git a/hooks/layers/useBereicheMarkersLayer.js b/hooks/layers/useBereicheMarkersLayer.js
index f06195605..571a13d34 100644
--- a/hooks/layers/useBereicheMarkersLayer.js
+++ b/hooks/layers/useBereicheMarkersLayer.js
@@ -50,10 +50,19 @@ const useBereicheMarkersLayer = (map, oms, apiUrl) => {
const data = await response.json();
const markers = data.map((item) => {
- const marker = L.marker([item.x, item.y], { icon: customIcon }).bindPopup(`
- ID Location: ${item.idLocation}
- ID Map: ${item.idMaps}
- `);
+ const marker = L.marker([item.x, item.y], { icon: customIcon });
+
+ // Tooltip statt Popup
+ marker.bindTooltip(
+ `ID Location: ${item.idLocation}
+ ID Map: ${item.idMaps}`,
+ {
+ permanent: false, // Tooltip wird nur bei Mouseover angezeigt
+ direction: "top", // Position des Tooltips relativ zum Marker
+ offset: [0, -20], // Verschiebung für bessere Sichtbarkeit
+ }
+ );
+
return marker;
});