javascript - Leaflet .addLayer() 功能失败，在控制台工作

Question

我认为这意味着我缺少有关 javascript 中嵌套函数工作的一些基本知识，但我无法在传单 map 中添加或删除图层 using a click function .具体来说，我有一个传单 map ，其中定义了许多矢量图层。这些层之一被添加到 map on page load ，然后后续层应该在层选择器中的单击事件上加载。

这是处理点击的函数，然后更新侧边栏图例，更新层选择器中的类，并且应该更新可见层:

// ADD THE LAYER CONTROL FUNCTION
$('.layer').click(function() {
  var oldLayer = $('.active').attr('id');
  var newLayer = $(this).attr('id');
  console.log(oldLayer + ' --> ' + newLayer);
  $('#infobits').html('<h2>' + this.text + '</h2><hr>' + legendFormatter(
    this.id));
  map.removeLayer(oldLayer);
  $('.layer').removeClass('active');
  $(this).addClass('active');
  map.addLayer(newLayer);
});

每次我点击一个新层，我都会得到Uncaught TypeError: undefined is not a function，无论我把函数放在哪里(我什至把它放在 .getJSON() 调用中少量)。令人困惑的是，我在浏览器中转到 JS 控制台并逐字在上述脚本的第 49 行输入函数生成的内容 (map.removeLayer(Percent_TC_bg) )， map 会移除相关图层。

我该怎么做才能让我的 map 无误地添加和删除图层？

Answer 1

我想 TypeError 是在 addLayer 或 removeLayer 中抛出的。 Map#addLayer和 #removeLayer接受 ILayer 对象作为参数，但是 oldLayer 和 newLayer 显然是 String，它直接来自 HTML 元素的 ID 属性.

我想，因此更改 oldLayer 和 newLayer 以欣赏 ILayer 对象将解决问题。