javascript Leaflet.js：检测地图何时完成缩放
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18609091/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Leaflet.js: detecting when map finishes zooming
提问by Wingston Sharon
So i'm making this application with leafet.js.
This application requires that i have to manually draw grids onto the screen,
that i've taken care in a draw_grid()function that draws a bunch of polygons to the screen.
所以我正在使用leafet.js 制作这个应用程序。这个应用程序要求我必须手动在屏幕上绘制网格，我在一个draw_grid()将一堆多边形绘制到屏幕的函数中很小心。
i have this function that i'm calling to trigger the change of the leaflet map.
zoom- the zoom integer and sizeis a dict like {x:1,y:1}that controls the size of the tiles drawn onto the map. (they need to change as the units the tiles are being drawn under are lat,long points on the map.
我有这个功能，我正在调用它来触发传单地图的更改。
zoom- 缩放整数，size是一个类似的字典{x:1,y:1}，控制绘制到地图上的图块的大小。（它们需要更改，因为正在绘制瓷砖的单位是地图上的经纬度点。
function changeZoom(zoom,size){
map.setZoom(zoom);
setSize(size);
setTimeout(drawGrid,500)s;
}
}
the reason i have to use the setTimeout is because the leaflet ignoresany drawing commands onto the map (which i'm doing as a layer) until the map has finished animating.
我必须使用 setTimeout 的原因是因为传单上的ignores任何绘图命令都在地图上（我正在作为图层执行），直到地图完成动画。
how to do this asynchronously instead?
如何异步执行此操作？
回答by Patrick D
回答by CodingWithSpike
In newer version of Leaflet, "zoomed" is no longer an event. There are now "zoomstart" and "zoomend" events:
在较新版本的 Leaflet 中，" zoomed" 不再是一个事件。现在有 " zoomstart" 和 " zoomend" 事件：
map.on("zoomstart", function (e) { console.log("ZOOMSTART", e); });
map.on("zoomend", function (e) { console.log("ZOOMEND", e); });
回答by Mansuri Nurulhuda
This is best way to managed leflet Zoom control clicked
这是管理左键缩放控件单击的最佳方式
/*Zoom Control Click Managed*/
var bZoomControlClick = false;
mymap.on('zoomend',function(e){
var currZoom = mymap.getZoom();
if(bZoomControlClick){
console.log("Clicked "+currZoom);
}
bZoomControlClick = false;
});
var element = document.querySelector('a.leaflet-control-zoom-in');
L.DomEvent.addListener(element, 'click', function (e) {
bZoomControlClick = true;
$(mymap).trigger("zoomend");
});
var element1 = document.querySelector('a.leaflet-control-zoom-out');
L.DomEvent.addListener(element1, 'click', function (e) {
bZoomControlClick = true;
$(mymap).trigger("zoomend");
});
