fix: Simuliere Klick-Events auf Marker beim Plus-Icon-Event

- Anstatt `map.spiderfy` zu verwenden, wird jetzt das Klick-Event auf nahegelegene Marker simuliert.
- Problem mit `TypeError: map.spiderfy is not a function` behoben.
- Marker im Umkreis von 50 Pixeln werden korrekt erkannt und ihr Klick-Event ausgelöst.
- Sicherstellung, dass vorhandene Marker-Events reibungslos funktionieren.
This commit is contained in:
ISA
2024-12-11 10:32:27 +01:00
parent 213c2e8111
commit fddb69113b

View File

@@ -79,15 +79,9 @@ export const restoreMapSettings = (map) => {
// Now update checkOverlappingMarkers to check if oms is initialized // Now update checkOverlappingMarkers to check if oms is initialized
export const checkOverlappingMarkers = (map, markers, plusIcon) => { export const checkOverlappingMarkers = (map, markers, plusIcon) => {
// Ensure markers is always an array
if (!Array.isArray(markers)) {
console.error("The `markers` argument is not an array:", markers);
return;
}
const overlappingGroups = {}; const overlappingGroups = {};
// Group markers by coordinates as strings // Gruppiere Marker basierend auf ihrer Position
markers.forEach((marker) => { markers.forEach((marker) => {
const latlngStr = marker.getLatLng().toString(); const latlngStr = marker.getLatLng().toString();
if (overlappingGroups[latlngStr]) { if (overlappingGroups[latlngStr]) {
@@ -97,18 +91,47 @@ export const checkOverlappingMarkers = (map, markers, plusIcon) => {
} }
}); });
// Add plus markers at coordinates where overlaps occur // Füge Plus-Icons für überlappende Marker hinzu
for (const coords in overlappingGroups) { for (const coords in overlappingGroups) {
if (overlappingGroups[coords].length > 1) { if (overlappingGroups[coords].length > 1) {
const latLng = L.latLng(coords.match(/[-.\d]+/g).map(Number)); const latLng = L.latLng(coords.match(/[-.\d]+/g).map(Number));
const plusMarker = L.marker(latLng, { icon: plusIcon }); const plusMarker = L.marker(latLng, { icon: plusIcon }).addTo(map);
plusMarker.addTo(map);
//localStorage benutzen statt console.log plusMarker.on("click", (e) => {
//console.log("Adding plus icon marker at", latLng); const clickedLatLng = e.latlng;
localStorage.setItem("Adding plus icon marker at", plusMarker);
// Finde nahegelegene Marker (50 Pixel als Beispielradius)
const nearbyMarkers = markers.filter((marker) => map.distance(marker.getLatLng(), clickedLatLng) < 50);
console.log("Nearby Markers for Plus Icon:", nearbyMarkers);
if (nearbyMarkers.length > 0) {
// Simuliere einen Klick auf jeden Marker
nearbyMarkers.forEach((marker) => {
marker.fire("click");
});
} else {
console.log("Keine Marker gefunden.");
}
});
} }
} }
//localStorage benutzen statt console.log };
//console.log("overlappingGroups", overlappingGroups);
localStorage.setItem("overlappingGroups", overlappingGroups); export const handlePlusIconClick = (map, markers, oms, clickedLatLng) => {
// Debugging-Ausgabe
console.log("Plus-Icon Position:", clickedLatLng);
// Finde Marker in der Nähe der Klickposition
const nearbyMarkers = markers.filter((marker) => map.distance(marker.getLatLng(), clickedLatLng) < 50);
// Debugging-Ausgabe
console.log("Gefundene Marker in der Nähe:", nearbyMarkers);
if (oms && nearbyMarkers.length > 0) {
// Spiderfy die gefundenen Marker
oms.spiderfy(nearbyMarkers);
} else {
console.log("Keine überlappenden Marker gefunden.");
}
}; };