Question

我正在使用leafletjs作为我的测试应用。我需要在调整浏览器大小时触发缩小事件。

这是我的浏览器调整大小代码：

(function(){
    $(window).on("resize", resize); 
    function resize() {
        "use strict";

        if($(window).width() <= 765){
            mapOptions.zoom = 5;
            console.log(mapOptions.zoom);
        }
    }
})();

此代码如果要显示地图：

L.TopoJSON = L.GeoJSON.extend({
    addData: function(jsonData) {    
        if (jsonData.type === "Topology") {
            for (key in jsonData.objects) {
                geojson = topojson.feature(jsonData, jsonData.objects[key]);
                L.GeoJSON.prototype.addData.call(this, geojson);
            }
        } else {
            L.GeoJSON.prototype.addData.call(this, jsonData);
        }
    }  
});

var tiles = L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png");
var latlng = new L.LatLng(28.40, 84.15);
mapOptions={
    dragging: false,
    zoomControl: true,
    scrollWheelZoom: false,
    doubleClickZoom: false,
    touchZoom: false,
    attributionControl: false,
    center: latlng,
    zoom: 7,
    layers: [tiles]
};
console.log(mapOptions.zoom + 'first');

map = L.map('map-nepal', mapOptions);
map.invalidateSize();

var topoLayer = new L.TopoJSON();
$.getJSON('js/map/districts.topo.json').done(addTopoData);

我所做的是创建一个名为mapOptions的全局变量。首先使用mapOptions.zoom = 7初始化地图，然后在调整浏览器大小时，我已将mapOptions.zoom的值更改为6。值已更改，但缩放地图没有效果。

Answer 1

如果要更改地图的缩放级别，请在要更改地图缩放级别时尝试setZoom()功能而不是mapOptions.zoom。所以，在你的情况下，使用这个

map.setZoom(6);

希望它能够发挥作用。

如何在浏览器调整大小时触发缩小事件？

1 个答案: