更改传单中的坐标 - 地图容器已初始化

Question

我正在使用Leaflet 地图，我想使用一个按钮来更改标记位置。问题是我的地图已经初始化了。

未捕获的错误：地图容器已初始化。

我一直在阅读一些帖子，但我不能正确地做到这一点。

This one，建议在初始化地图之前使用此行，但它不起作用（可能我做错了）document.getElementById('issMap').innerHTML = "<div id='map'></div>";。

其他一些解决方案建议使用map.remove()，但效果不佳。

阅读leaflet's documentation 我想我只需要删除一个图层并放置另一个图层，但我不知道如何。

我的代码，

function mapa(coords){

    centerMap_coords = centerMap(coords)

    if (map != undefined) { map.removeLayer(); } //Not working
    var map = L.map("issMap", {
        center: [centerMap_coords[0], centerMap_coords[1]],
        zoom: 13,
        gestureHandling: true
    });
    const attribution = '&copy;<a href="https://www.openstreetmap.org/copyright/">OpenStreetMap</a> contributors';
    const tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
    const tiles = L.tileLayer(tileUrl, {attribution}).addTo(map);

$('#btn_map').click(function(){
    if( $('#ultima_posicion_check').is(':checked') ) {
        var coords = [37.363,2.336];
        mapa(coords);

    }else if($('#ruta_ultimas_posiciones_check').is(':checked')){
        var coords = [39.321,2.258];
        mapa(coords);

    } else{
        alert('Checkbox empty');
    }

谢谢！

Answer 1

如果您想从地图上更改位置，请使用map.setView([lat,lng]) 或map.panTo([lat,lng])。

如果您想从标记更改位置，请使用：

var marker = L.marker([39.321,2.258]).addTo(map);

function clickOnMap(){
marker.setLatLng([37.363,2.336]);
}

您可以将标记放置在点击的位置：

map.on('click', function(e){
marker.setLatLng(e.latlng);
//Or new marker:
//L.marker(e.latlng).addTo(map);
});