使用传单最大边界设置边界，但不起作用

嗨，我尝试在传单地图中设置maxbaounds，但它不起作用。我的第一个问题是最大边界停止在我设置的边界之外平移？我遵循此示例，但我的代码中有问题

传单最大边界 - 边界不起作用

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/leaflet@1.4.0/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/leaflet@1.4.0/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: '&copy; <a href="http://info.2gis.com/">2GIS</a> &copy; <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>

在L.map上使用maxBounds来设置边界限制。

var map = L.map('map')
                .setView([35.126411,33.429859], 9)
                .setMaxBounds(bounds);

另外 - 不要将mapbox.js与leaflet.js混淆 - 它们是不同的。

相关内容

最新更新

热门标签：