设置最大边界不起作用

Question

我似乎无法设置最大边界，因此在用户到达某个点后地图会反弹。每次我都厌倦了改变fitbounds（）代码时，地图也会从我的网站上消失。

我一遍又一遍地看着Leaflet的文档，运气很少，并且正在通过Google查找任何答案，我尝试过的所有代码都无法正常工作。我相信我错过了或者看不到一些非常简单的东西。

有任何想法吗？

Answer 1

如果你想要的只是将视图限制在给定的地理边界，最简单的解决方案是设置maxBounds选项。除非你想动态地做，否则使用的选项是setMaxBounds。 fitBounds方法似乎是多余的，实际上可能是你没有得到预期结果的原因。

var southWest = L.latLng(52.456009,-10.685582);
var northEast = L.latLng(51.699800,5.215615); 

var maxBoundArea = L.latLngBounds(southWest, northEast);

var map = L.map('map', {        
    zoomControl:true, 
    maxNativeZoom:28, 
    minZoom:8, 
    maxBounds: maxBoundArea
});

Answer 2

我建议写一个约束函数

function constrain(n,low,high){
    return Math.max(Math.min(n, high), low);
}

*注意：我自己没有想到这个，它是p5中的一个功能，并认为它可能有用*

文档：

https://github.com/processing/p5.js/blob/0.7.3/src/math/calculation.js#L76