ich habe was ausprobiert, aber da scheint was falsch zu sein, sieht man einen Fehler auf den ersten blick?
Also die Aufgabe ist: Es sollen die gefundene Position auf einer Karte darstellen mit Hilfe von Leaflet. Mit der Funktion updateMarkers werden die übergebenen GeoTags auf der Karte als Marker angezeigt. Beim Aufruf der Methode werden die zuvor vorhandenen Marker entfernt.
updateLocation-Funktion sollte wie folgt ergänzt werden:
- Die Funktionen initMap und updateMarkers mit den aktuellen Koordinaten aufrufen. Daraufhin wird die Karte in Ihrer App angezeigt.
- Suche im DOM das Image Element auf der Webseite.
- Lösche sowohl das <img>-Element als auch das <p>-Element für die Beschriftung mithilfe des DOM (nicht in der HTML Datei). Dadurch wird der Platzhalter zur anfänglich Darstellung der Karte auf der Webseite wieder entfernt.
Kann jemand helfen? Mit Schritten auf die man unbedingt achten soll, oder so?
Der momentane Code sieht so aus…:
function updateLocation() {
// Auslesen der Position mit findLocation
LocationHelper.findLocation((locationHelper) => {
// Koordinaten aus dem LocationHelper-Objekt abrufen
const latitude = locationHelper.latitude;
const longitude = locationHelper.longitude;
// Koordinaten in die Formulare eintragen
document.getElementById('taglatinput').value = latitude;
document.getElementById('taglonginput').value = longitude;
document.getElementById('disclatinput').value = latitude;
document.getElementById('disclonginput').value = longitude;
// Koordinaten auf Karte darstellen
MapManager.initMap(latitude, longitude);
MapManager.updateMarkers(latitude, longitude);
// Image und p-Elemente im DOM entfernen
const mapImage = document.getElementById('map');
const mapDescription = document.getElementById('resultMap');
// Konsolenausgabe zur Überprüfung der Koordinaten
console.log("Latitude:", latitude);
console.log("Longitude:",longitude);
if (mapImage && mapDescription) {
mapImage.remove();
mapDescription.remove();
}
});
}
document.addEventListener("DOMContentLoaded", updateLocation);
