как убрать маркер, добавленный в нагрузку, листовка

Question

Я загружаю маркер при загрузке страницы, я хочу, когда пользователь нажимает на карту, удаляет этот маркер и добавляет другой маркер, но он не работает.

это то, что я пробовал

 var map = L.map('map').setView([35.79, 51.47], 13);
    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);


    theMarker = { lat: 35.810992207495154, lng: 51.45223617553712};
    L.marker(theMarker, {
        draggable: true,
        title: "Resource location",
        alt: "Resource Location",
        riseOnHover: true
    }).addTo(map)
    map.on('click', function (e) {
        lat = e.latlng.lat;
        lon = e.latlng.lng;

        alert("You clicked the map at LAT: " + lat + " and LONG: " + lon);
        //Clear existing marker, 

        if (theMarker != undefined) {
            map.removeLayer(theMarker);
        };

        //Add a marker to show where you clicked.
        theMarker = L.marker([lat, lon]).addTo(map);
    });

и это рабочий образец https://jsfiddle.net/ky0xrpe9/

Answer 1

    theMarkerLatLng = { lat: 35.810992207495154, lng: 51.45223617553712};
    theMarker = L.marker(theMarkerLatLng, {
        draggable: true,
        title: "Resource location",
        alt: "Resource Location",
        riseOnHover: true
    }).addTo(map)