Flexibilität: Der Wert für m ist jetzt dynamisch und hängt von der aktuellen URL ab
This commit is contained in:
@@ -780,7 +780,17 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
|
|||||||
//---------------------------------------
|
//---------------------------------------
|
||||||
// Initialisiere Leaflet-Karte
|
// Initialisiere Leaflet-Karte
|
||||||
// Rufe useBereicheMarkersLayer direkt auf
|
// 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(() => {
|
/* useEffect(() => {
|
||||||
if (map && oms) {
|
if (map && oms) {
|
||||||
|
|||||||
@@ -50,10 +50,19 @@ const useBereicheMarkersLayer = (map, oms, apiUrl) => {
|
|||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
|
|
||||||
const markers = data.map((item) => {
|
const markers = data.map((item) => {
|
||||||
const marker = L.marker([item.x, item.y], { icon: customIcon }).bindPopup(`
|
const marker = L.marker([item.x, item.y], { icon: customIcon });
|
||||||
<strong>ID Location:</strong> ${item.idLocation} <br />
|
|
||||||
<strong>ID Map:</strong> ${item.idMaps}
|
// Tooltip statt Popup
|
||||||
`);
|
marker.bindTooltip(
|
||||||
|
`<strong>ID Location:</strong> ${item.idLocation} <br />
|
||||||
|
<strong>ID Map:</strong> ${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;
|
return marker;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user