嗨，我尝试在传单地图中设置maxbaounds，但它不起作用。我的第一个问题是maxbounds停在我设置的边界之外吗？我遵循以下示例，但是我的代码出了点问题
Leaflet maxBounds - bounds do not work
https://docs.mapbox.com/mapbox.js/example/v1.0.0/maxbounds/
我的密码
<html>
<head>
<title>A Leaflet map!</title>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://maps.api.2gis.ru/2.0/loader.js?pkg=full"></script>
<style>
#map{ height: 100% }
</style>
</head>
<body>
<div id="map"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
<script>
var southWest = L.latLng(34.072711,31.758391),
northEast = L.latLng(36.113055, 35.124228),
bounds = L.latLngBounds(southWest, northEast);
var counties = $.ajax({
url: "https://gist.githubusercontent.com/vassilaros/3791204ca226d5b236b4cd3106ef23cf/raw/PicnicSites.geojson",
dataType: "json",
success: console.log("County data successfully loaded."),
error: function(xhr) {
alert(xhr.statusText)
}
})
$.when(counties).done(function() {
var map = L.map('map')
.setView([35.126411,33.429859], 9);
//tiles - http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png
var basemap = L.tileLayer('http://tile1.maps.2gis.com/tiles?x={x}&y={y}&z={z}', {
attribution: '© <a href="http://info.2gis.com/">2GIS</a> © <a href="https://www.opencartography.com">Open Cartography</a>',
subdomains: 'abcd',
maxBounds: bounds,
maxZoom: 19,
minZoom: 9
}).addTo(map);
// Add requested external GeoJSON to map
var kyCounties = L.geoJSON(counties.responseJSON).addTo(map);
var scale = L.control.scale()
scale.addTo(map)
});
</script>
</body>
</html>
最佳答案
在maxBounds上使用L.map设置边界限制。
var map = L.map('map')
.setView([35.126411,33.429859], 9)
.setMaxBounds(bounds);
另外-不要将
mapbox.js与leaflet.js混淆-它们是不同的。