Javascript 传单-仅在选择特定图层时显示GeoJSON数据

我正在尝试结合这两个传单教程：

我使用的是一个层控件，用户可以在tile提供者之间切换，也可以在GeoJSON数据上切换。 JSFiddle：

---

谢谢你的建议

这个插件似乎做到了：

与

baselayerchange

一起，我得到以下信息：

var control = L.control.activeLayers(baseMaps);
control.addTo(map);

map.on('baselayerchange', baseLayerChange);

function baseLayerChange(){
if (control.getActiveBaseLayer().name == 'Black and White') {
      map.addLayer(loadstates);
}
    else
   {
        map.removeLayer(loadstates);        
   }
}

这正是我想要的。 更新的JSFIDLE:

---

如果有人知道不需要额外插件的解决方案，请告诉我。

您可以从自己的答案中跳过插件，只需使用

L.Map

实例中的

baselayerchange

事件：

var baseLayers = {
  'CartoDB Positron': L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
  }),
  'CartoDB Dark Matter': L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
  })
}

var map = L.map('leaflet', {
  'center': [0, 0],
  'zoom': 0,
  'layers': [baseLayers['CartoDB Positron']]
});

var layerControl = new L.Control.Layers(baseLayers).addTo(map);

map.on('baselayerchange', function (event) {
  // Returns 'CartoDB Positron' or 'CartoDB Dark Matter'
  console.log(event.name);
});

var baseLayers={
“CartoDB正电子”：L.tileLayer（'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png'{
属性：'©；贡献者，©；'
}),
“CartoDB暗物质”：L.tileLayer（'http://{s}.basemaps.cartocdn.com/Dark_all/{z}/{x}/{y}.png'{
属性：'©；贡献者，©；'
})
}
var map=L.map（‘传单’{
“中心”：[0,0]，
“缩放”：0，
“层”：[baseLayers['CartoDB Positron']]
});
var layerControl=新的L.Control.Layers（基本层）.ADTO（映射）；
map.on（'baselayerchange'，函数（事件）{
//返回“CartoDB正电子”或“CartoDB暗物质”
console.log（event.name）；
});

---

普朗克的例子：

哦，真不错。感谢您帮助解决了一个n00b问题。；-）

var control = L.control.activeLayers(baseMaps);
control.addTo(map);

map.on('baselayerchange', baseLayerChange);

function baseLayerChange(){
if (control.getActiveBaseLayer().name == 'Black and White') {
      map.addLayer(loadstates);
}
    else
   {
        map.removeLayer(loadstates);        
   }
}

var baseLayers = {
  'CartoDB Positron': L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
  }),
  'CartoDB Dark Matter': L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', {
      attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
  })
}

var map = L.map('leaflet', {
  'center': [0, 0],
  'zoom': 0,
  'layers': [baseLayers['CartoDB Positron']]
});

var layerControl = new L.Control.Layers(baseLayers).addTo(map);

map.on('baselayerchange', function (event) {
  // Returns 'CartoDB Positron' or 'CartoDB Dark Matter'
  console.log(event.name);
});