Відключити взаємодію з листівками тимчасово

Як я можу тимчасово відключити масштабування / перетягування Mapview у Leaflet.js Перепробував так багато способів, але без удачі. Важливо зробити це тимчасовим, і мені також потрібна можливість знову включити.

leaflet

— Бернар
джерело

Будь-які ідеї, як це зробити за допомогою CSS? Мені потрібно відключити перетягування на мобільний за допомогою медіа-запиту. Я спробував встановити прозорий шар поверх нього, але він клацає прямо через цей шар. Я навіть грав з покажчиками, але не пощастило. Правильний підхід, швидше за все, через використання -webkit-user-drag: none; але я застосував це до кожного елемента, який я можу знайти, і досі не пощастило. Спасибі.

Я відповів на це запитання нижче .

— hayatbiralem

Відповіді:

ви хочете зробити (якщо ваша карта дзвонить 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';

увімкніть його знову за допомогою

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

— Кальвін
джерело

Велике спасибі. Я виглядав так неправильно - думав, що для цього повинен бути єдиний метод.

— Бернхард

Це рішення має деякі проблеми: Курсор миші все ще є рукою. Прокручування сторінки за допомогою жестів дотику неможливо по карті. Коли відкриття Поповер переміщає карту, вона ніколи не повернеться назад.

— netAction

@netAction, Чи є у вас вирішення проблеми прокручування жестом дотику?

— Кріс Фремген

@ChrisFremgen: map.dragging.disable (); робить трюк, що карта зупиняє отримання жестів прокрутки.

— netAction

Чи є спосіб відключити лише ZoomIn?

— howard.D

Якщо ви не хочете відключити кожен обробник вручну, ви можете перетворити цикл на всі їх і відключити / увімкнути їх.

Відключити

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

});

Увімкнути

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

});

— устроец
джерело

Будьте уважні, що використання не загальнодоступних властивостей (_handlers) може призвести до помилок у вашому коді навіть при зміні версії патчу листівки, оскільки це гарантовано не залишиться незмінним. Запит на функцію слід подати на листівку;)

— Luckylooke

Я думаю, ви можете обернути свою карту допоміжним контейнером, а ви можете відключити її за допомогою простого класу CSS, як-от is-locked.

Ось що я говорю:

.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;
}

Я сподіваюся, що це допомагає.

— hayatbiralem
джерело