Come posso attivare un evento di riduzione del ridimensionamento del browser?

Question

Sto usando leafletjs per la mia app di prova. Devo attivare l'evento di zoomout quando il browser viene ridimensionato.

Ecco il mio browser di codice di ridimensionamento:

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

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

questo codice se per mostrare la mappa:

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); 

Quello che ho fatto è creare una variabile globale chiamata mapOptions. Innanzitutto la mappa viene inizializzata con mapOptions.zoom = 7 e quando il browser viene ridimensionato, ho modificato il valore di mapOptions.zoom in 6. Il valore è cambiato ma non vi è alcun effetto nello zoom della mappa.

Answer 1

Se si desidera modificare il livello di zoom della mappa, provare la funzione setZoom() anziché mapOptions.zoom quando si desidera modificare il livello di zoom della mappa. Quindi, nel tuo caso, usa questo

map.setZoom(6); 

Spero che funzioni.