我有一个featureLayers和tileLayers的简单图层切换。仅在featureLayers关闭时,切换按钮仍然有效。我查看了参考文档,但看不出为什么只有featureLayer无法正常工作:
var baseLayer = new L.mapbox.tileLayer('mapster.l4b4kjoi');
this.className == 'active';
var ui = document.getElementById('map-ui');
var future = L.mapbox.featureLayer('mapster.l4pda0e3');
var demand = L.mapbox.featureLayer('seamap.l50l5ecd');
var historic = L.mapbox.featureLayer('mapster.l4pda0e3');
var navwater = L.mapbox.tileLayer('mapster.ydvyqcpm');
var coasturban = L.mapbox.tileLayer('mapster.znl98dfb');
addLayer(future, L.mapbox.gridLayer('mapster.l4pda0e3'),'Future Projects', 4);
addLayer(demand, L.mapbox.gridLayer('seamap.l50l5ecd'),'Current Read-Mix Demand', 4);
addLayer(historic, L.mapbox.gridLayer('mapster.l4pda0e3'),'Historic Read-Mix Use', 4);
addLayer(navwater, L.mapbox.gridLayer('mapster.ydvyqcpm'),'Navigable Waterways', 3);
addLayer(coasturban, L.mapbox.gridLayer('mapster.znl98dfb'),'Coastal Urban', 4);
function addLayer(layer, gridlayer, name, zIndex) {
layer
.setZIndex(zIndex)
gridlayer
// add the gridControl to the active gridlayer
var gridControl = L.mapbox.gridControl(gridlayer, {follow: true}).addTo(map);
// Create a simple layer switcher that toggles layers on and off.
var item = document.createElement('li');
var link = document.createElement('a');
link.href = '#';
link.innerHTML = name;
link.onclick = function(e) {
e.preventDefault();
e.stopPropagation();
if ($(this).text() == 'Toggle All Off') {
map.eachLayer(function (layer) {
map.removeLayer(layer);
map.legendControl.removeLegend(layer.getTileJSON().legend);
});
this.className = '';
map.addLayer(baseLayer);
} else
if (map.hasLayer(layer)) {
map.removeLayer(layer);
map.removeLayer(gridlayer);
// you had "thelayer", but it should be "layer":
map.legendControl.removeLegend(layer.getTileJSON().legend);
// change two lines that were here to the following:
this.className = '';
} else {
map.addLayer(layer);
map.addLayer(gridlayer);
this.className = 'active';
map.legendControl.addLegend(layer.getTileJSON().legend);
}
};
item.appendChild(link);
ui.appendChild(item);
}