约束Mapbox只能向北/向南平移吗? [英] Constrain Mapbox panning north/south only?
问题描述
任何人都知道如何仅使用北/南边界来约束Mapbox地图中的平移吗?我想做的是使用世界副本，以便用户可以连续地从东向西平移，但限制北向和南向平移，以便您不能在地图图块之外平移(我觉得这很烦人).在初始化地图时，我目前正在使用maxbounds来防止平移到极点上方和下方的白色图块，但这对世界复制来说是不行的.
Anyone know how to constrain the panning in a Mapbox map only using north/south bounds? What I would like to do is use the world copy so that users can continuously pan east to west, but restrict the north and south panning so that you can't pan outside of the map tiles (which I find super annoying). I'm currently using a maxbounds when initializing the map to prevent panning into the white tiles above and below the poles, but that's a no-go with world copying.
推荐答案
您可以在用于设置maxBounds选项的L.LatLngBounds中使用-Infinity west和Infinity east(thnx Ivan):(在代码段中使用Leaflet，但也适用于Mapbox.js)
You can use -Infinity west, and Infinity east (thnx Ivan) in the L.LatLngBounds you use for setting the maxBounds option: (using Leaflet in the snippet but should work for Mapbox.js too)
var map = new L.Map('leaflet', {
'center': [0, 0],
'zoom': 2,
'worldCopyJump': true,
'layers': [
new L.TileLayer('//{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
'attribution': '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, © <a href="http://cartodb.com/attributions">CartoDB</a>'
}),
new L.Marker([0,0])
],
'maxBounds': [
[-90, -Infinity],
[90, Infinity]
]
});
body {
margin: 0;
}
html, body, #leaflet {
height: 100%;
}
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
</head>
<body>
<div id="leaflet"></div>
<script type="application/javascript" src="//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
</body>
</html>
这篇关于约束Mapbox只能向北/向南平移吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
