Question

注意：我尝试不重复此问题。我试图使用以前帖子中的答案无济于事。

我不断收到错误消息：

Uncaught Error: Map container is already initialized.

使用以下代码：

$('#example1').on('click', 'tr > td > a.loadMap', function(e) 
{
  e.preventDefault();
  var $dataTable = $('#example1').DataTable();
  var tr = $(this).closest('tr');
  var data = $dataTable.rows().data();

  var actramp = $(this).attr('data-actramp');
  var actimpdel = $(this).attr('data-actimpdel');   
  var actramplat = parseFloat($(this).attr('data-actramplat'));
  var actramplng = parseFloat($(this).attr('data-actramplng'));
  var actdellat = parseFloat($(this).attr('data-actdellat'));
  var actdellng = parseFloat($(this).attr('data-actdellng'));
  var actreclat = parseFloat($(this).attr('data-actreclat')); 
  var actreclng = parseFloat($(this).attr('data-actreclng')); 

  $('#actionMatchbackModal').modal('show');

  $("#actionMatchbackModal").on("shown.bs.modal", function () {
    initMap(actramp, actimpdel, actexpreceipt, actramplat, actramplng, actreclat, actreclng, actdellat, actdellng); 
  });
});

function initMap(actramp, actimpdel, actexpreceipt, actramplat, actramplng, actreclat, actreclng, actdellat, actdellng)
{
  var map = L.map('map').setView([actreclat,actreclng], 8);

  // vvv this was an answer provided from another post vvv
  if (map != undefined) {
    map.remove();
  }
  // ^^^ but the map stopped loading completely ^^^

  map.invalidateSize();

  L.tileLayer('https://api.maptiler.com/maps/streets/{z}/{x}/{y}.png?key=zAlHsNvo6jxv4ENZxW3R', {
    attribution: '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>'
  }).addTo(map);
}

我可以在上述代码中添加/删除哪些内容，以解决“地图容器已初始化”错误？

Answer 1

您在正确的位置，但是您应该remove()映射后再重新初始化-并确保map变量的范围正确。像这样

var map;

...

function initMap(actramp, actimpdel, actexpreceipt, actramplat, actramplng, actreclat, 
actreclng, actdellat, actdellng)
{

    if (map != undefined) map.remove();
    map = L.map('map').setView([actreclat,actreclng], 8);

    ...

}

jQuery和Leaflet给出错误“地图容器已初始化”

1 个答案: