77

我正在尝试删除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 选项可以从地图中删除缩放控制,但我没有让它工作的运气。

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

谢谢!

4

7 回答 7

139

这对我有用:

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

使用 mapbox 尝试:

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

请参阅Leaflet 文档中的地图创建zoomControl 选项

于 2013-05-14T07:38:41.343 回答
63

如果要动态打开和关闭缩放,可以执行以下操作:

map.touchZoom.disable();
map.doubleClickZoom.disable();
map.scrollWheelZoom.disable();
map.boxZoom.disable();
map.keyboard.disable();
$(".leaflet-control-zoom").css("visibility", "hidden");
于 2014-02-07T02:00:48.107 回答
18

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

// 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);
于 2013-05-15T23:23:35.440 回答
12

您可以通过这种方式删除控件zoomControl

map.removeControl(map.zoomControl);
于 2016-02-01T22:03:26.337 回答
8

你可以使用

map.zoomControl.remove();

于 2015-11-23T06:45:32.407 回答
7
map.scrollWheelZoom.disable();
于 2014-02-02T12:39:39.250 回答
3

要动态删除然后添加回缩放控件:

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

if( wantToRemove ) {
    map.removeControl( map.zoomControl ); 
} else {
    map.addControl( map.zoomControl );
}
于 2018-04-19T21:12:23.010 回答