问题描述
我尝试像这样重写boxzoom事件
I try to rewrite the boxzoom event, like this,
map.on('boxzoomend', function(e) {
console.log('end')
})
但是，boxzoom仍在缩放，我不知道如何停止它，而只是在控制台中打印文本.我希望将boxzoom重写为以下内容
However, the boxzoom still zoomed and I have no idea how to stop it and just print text in console. I hope to rewrite boxzoom as the following
- 停止缩放
- 在控制台中打印文本
您能提供重写事件的正确方法吗?谢谢.
Can you provide correct way to rewrite the event? Thank you.
推荐答案
缩放不是在boxzoomend事件中执行，而是在BoxZoom处理程序中执行.让我引用传单源代码来自src/map/handler/Map.BoxZoom.js :
The zooming is not performed in the boxzoomend event, but rather in the BoxZoom handler. Let me quote the Leaflet source code from src/map/handler/Map.BoxZoom.js:
_onMouseUp: function (e) {
...
this._map
.fitBounds(bounds)
.fire('boxzoomend', {boxZoomBounds: bounds});
},
实现所需功能的更好方法是创建一个扩展BoxZoom处理程序的新处理程序，修改所需的方法.
A better way to achieve the functionality you want is to create a new handler that extends the BoxZoom handler, modifying the methods that you need.
我建议您阅读传单教程，尤其是创建Leaflet插件，然后再执行此操作.
I recommend that you read the Leaflet tutorials, specially the ones on creating Leaflet plugins before doing this.
想法是扩展BoxZoom处理程序:
The idea is to extend the BoxZoom handler:
L.Map.BoxPrinter = L.Map.BoxZoom.extend({
...修改_onMouseUp方法...
...modifying the _onMouseUp method...
_onMouseUp: function (e) {
...因此它不会缩放，而只是打印内容:
...so that instead of zooming, it just prints things:
...
console.log(bounds);
this._map.fire('boxzoomend', {boxZoomBounds: bounds});
}
}
并且如本教程所述，钩住处理程序并为其提供一些映射选项:
And as the tutorial explains, hook the handler and provide some map options for it:
L.Map.mergeOptions({boxPrinter: true});
L.Map.addInitHook('addHandler', 'boxPrinter', L.Map.BoxPrinter);
在使用此功能时，默认情况下，为所有地图实例禁用默认的BoxZoom处理程序:
While we're at it, disable the default BoxZoom handler for all map instances by default:
L.Map.mergeOptions({boxZoom: false});
这篇关于重写Leaflet事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！