Question

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

我正在使用MapBox.js version of 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]);

documentation表示有一个zoomControl选项可以从地图中删除缩放控件，但我没有运气让它起作用。

如何使用此实现删除缩放控件？

谢谢！

Answer 1

这对我有用。

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

你试过吗？

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

Answer 2

如果你想动态打开和关闭缩放，你可以这样做：

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

Answer 3

感谢坐标的回答，我能够找出正确的方法。解决方案是：

// 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);

Answer 4

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

map.removeControl(map.zoomControl);

Answer 5

你可以使用

map.zoomControl.remove();

Answer 6

map.scrollWheelZoom.disable();

Answer 7

要动态删除，请添加缩放控件：

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

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

LeafletJS：如何删除缩放控件

7 个答案: