且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

重写Leaflet事件

更新时间:2023-02-11 08:30:21

缩放不是在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.

我建议您阅读传单教程,尤其是

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

此工作示例中