6

要重现此问题,您可以访问http://leafletjs.com/并在 javascript 控制台中编写以下内容:

> map.getZoom()
15
> map.setZoom(10);map.setZoom(1);
Object
> map.getZoom()
10

我期待最终的 getZoom 返回1。为什么会这样?该问题可能与缩放动画有关。如果在动画结束之前调用了 setZoom,它将被忽略。

我正在将传单与 emberjs 集成,并希望允许通过外部更改进行缩放更改。如果用户快速更改缩放,则效果不理想。

4

1 回答 1

5

L.Map.setZoomL.Map.setView那个叫L.Map._animateZoomIfClose。如果map._animatingZoom为真,则任何缩放都将停止。map._animatingZoom像寻找缩放动画一样工作:

  1. 检查L.Map._animateZoomIfClose是否true停止缩放,否则调用L.Map._animateZoom
  2. 设置为trueatL.Map._animateZoom并开始 css 转换。
  3. 在 css 过渡结束时设置为falseat 。L.Map._onZoomTransitionEnd

为什么是原样?我认为因为很难打破 css 过渡工作。

因此,如果您将禁用任何 css 转换和转换,您的代码必须正常工作。您还可以添加自己的扩展:如果map._animatingZoom === true然后将您的操作放入数组,则在map._catchTransitionEnd调用时处理此并将您的操作从数组和处理中转移:

if (L.DomUtil.TRANSITION) {
    L.Map.addInitHook(function () {
        L.DomEvent.on(this._mapPane, L.DomUtil.TRANSITION_END, function () {
            var zoom = this._zoomActions.shift();
            if (zoom !== undefined) {
                this.setZoom(zoom);
            }
        }, this);
    });
}

L.Map.include(!L.DomUtil.TRANSITION ? {} : {
    _zoomActions: [],
    queueZoom: function (zoom) {
        if (map._animatingZoom) {
            this._zoomActions.push(zoom);
        } else {
            this.setZoom(zoom);
        }
    }
});
于 2013-03-28T14:42:58.713 回答