LeafletJS：如何删除缩放控件

Question

我正在尝试在LeafletJS地图上移除缩放控件（+/-）。

我正在使用MapBox.js版本的Leaflet，但大多数操作与Leaflet相同。我像这样实现我的地图：

var map = L.mapbox.map('map');

var layer = L.mapbox.tileLayer('MAPBOX-ID', {
    format: 'jpg70',
    minZoom: 13,
    maxZoom: 15,
    reuseTiles: true, 
    unloadInvisibleTiles: true
});
map.addLayer(layer);
map.setView([40.73547,-73.987856]);

文档中说有一个zoomControl选项，可以将缩放控件从地图上移除，但我在实现时没有成功。

如何通过此实现移除缩放控制？

- Brett DeWoody

Answer 1

这对我有用：

var map = new L.map('map', { zoomControl: false });

使用Mapbox尝试：

var map = L.mapbox.map('map', { zoomControl: false });

请参阅 Leaflet 文档中的 地图创建 和 缩放控件选项。

- coordinate

---

"var map = L.mapbox.map('map', { zoomControl:false });" 这段代码无法运行，第二个参数需要是指定地图类型的字符串，第三个参数使用 { zoomControl:false }。请注意不要改变原文意思。 - Programster

若只想禁用鼠标滚轮缩放功能，但仍然希望能使用地图上的"+"和"-"按钮进行缩放，则应将 "zoomControl" 替换为 "scrollWheelZoom"。 - Programster

Answer 2

如果您想要动态地打开或关闭缩放功能，可以这样做：

map.touchZoom.disable();
map.doubleClickZoom.disable();
map.scrollWheelZoom.disable();
map.boxZoom.disable();
map.keyboard.disable();
$(".leaflet-control-zoom").css("visibility", "hidden");

- Allie Hoch Janoch

---

想要禁用拖拽功能的人也可以这样做：map.dragging.disable(); - sam

Answer 3

得益于Coordinate的答案，我能够找到正确的方法。解决方案如下：

// Create the map
var map = L.mapbox.map('map', null, { zoomControl:false });

// Create my custom layer
var layer = L.mapbox.tileLayer('MAPBOX-ID', {
    format: 'jpg80',
    minZoom: 13,
    maxZoom:15,
    tileSize: 256,
    reuseTiles: true, 
    unloadInvisibleTiles: true
});


// Add the layer
map.addLayer(layer);

- Brett DeWoody

Answer 4

您可以通过以下方式删除控件zoomControl：

map.removeControl(map.zoomControl);

- leobelizquierdo

Answer 5

你可以直接使用 map.zoomControl.remove(); 来移除地图的缩放控件。

- yemaw

---

在我的情况下，我得到了一个 TypeError: map.zoomControl.remove 不是一个函数。我找到的方法是使用 removeControl 函数，像这样：map.removeControl(map.zoomControl); - leobelizquierdo

我猜，map.zoomControl.remove() 是在版本1.0.0中的新功能，而 map.removeControl() 则适用于较低版本。 - yemaw

Answer 6

map.scrollWheelZoom.disable();

- Anik

Answer 7

为了动态地移除并添加缩放控件：

var map = L.mapbox.map('map');

if( wantToRemove ) {
    map.removeControl( map.zoomControl ); 
} else {
    map.addControl( map.zoomControl );
}

- CDM

---

这个答案仍然有效，不像其他的。 - user9802118