Disabilita l'interazione con i volantini temporaneamente

Come posso disabilitare temporaneamente lo zoming / il trascinamento di Mapview in Leaflet.js Ho provato tanti modi ma senza fortuna. È importante renderlo temporaneo e ho anche bisogno dell'opzione per abilitarlo di nuovo.

leaflet

— Bernhard
fonte

Qualche idea su come farlo con i CSS? Devo disabilitare il trascinamento sul cellulare utilizzando una query multimediale. Ho provato a impostare un livello trasparente sopra di esso, ma fa clic proprio attraverso quel livello. Ho anche giocato con eventi puntatore ma senza fortuna. L'approccio corretto è molto probabilmente attraverso l'uso di -webkit-user-drag: none; ma l'ho applicato a tutti gli elementi che posso trovare e ancora senza fortuna. Grazie.

Ho risposto a questa domanda qui sotto .

— Hayatbiralem,

Risposte:

che vuoi fare (supponendo che la tua mappa sia chiamata map)

map.dragging.disable();
map.touchZoom.disable();
map.doubleClickZoom.disable();
map.scrollWheelZoom.disable();
map.boxZoom.disable();
map.keyboard.disable();
if (map.tap) map.tap.disable();
document.getElementById('map').style.cursor='default';

riaccenderlo con

map.dragging.enable();
map.touchZoom.enable();
map.doubleClickZoom.enable();
map.scrollWheelZoom.enable();
map.boxZoom.enable();
map.keyboard.enable();
if (map.tap) map.tap.enable();
document.getElementById('map').style.cursor='grab';

— Calvin
fonte

Grazie mille. Avevo un aspetto così sbagliato _ pensavo che ci fosse un solo metodo per farlo.

— Bernhard,

Questa soluzione presenta alcuni problemi: il cursore del mouse è ancora una mano. Lo scorrimento della pagina con gesti tattili non è possibile sulla mappa. Quando l'apertura di un Popover sposta la mappa, non tornerà mai indietro.

— netAzione

@netAction, hai una soluzione al problema dello scorrimento dei gesti tattili?

— Chris Fremgen,

@ChrisFremgen: map.dragging.disable (); fa il trucco che la mappa smette di recuperare i gesti di scorrimento.

— netAzione

C'è un modo per disabilitare solo zoomIn?

— howard.D,

Se non si desidera disabilitare manualmente ciascun gestore, è possibile eseguire il ciclo su tutti e disabilitare / abilitarli.

disattivare

map._handlers.forEach(function(handler) {
    handler.disable();

});

Abilitare

map._handlers.forEach(function(handler) {
    handler.enable();

});

— ustroetz
fonte

Attenzione che l'uso di proprietà non pubbliche (_handlers) può causare errori nel codice anche in caso di modifiche alla versione della patch del foglio illustrativo poiché non è garantito che rimanga invariato. La richiesta di funzione deve essere inviata al volantino;)

— Luckylooke,

Penso che puoi avvolgere la tua mappa con un contenitore di supporto e puoi disabilitarla con una semplice classe CSS come is-locked.

Ecco di cosa sto parlando:

.map-container {
  position: relative;
}

.map-container .map {
  position: relative;
  z-index: 1;
}

.map-container.is-locked:after {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  content: "";
  display: block;
}

Spero possa essere d'aiuto.

— hayatbiralem
fonte