Листовка, воспроизведение / вызов перетаскивания - PullRequest
Новая
       7

Листовка, воспроизведение / вызов перетаскивания

0 голосов
/ 02 июля 2018

Я использую Angular 6 и Leaflet 1.2 для своего проекта.

Я хочу воспроизвести эффект перетаскивания, когда пользователь удерживает правую или левую кнопку мыши на Leaflet Map. Например, я хочу иметь возможность начать перетаскивать карту, когда я постоянно нажимаю пробел.

Я уже протестировал многие функции, такие как вызов событий 'mousedown', 'mouseup', 'click', 'drag', 'dragstart' на Leaflet Map, но ничего не происходит; событие вызывается правильно, но событие перетаскивания не происходит.

Я все еще блокирую это, и кажется, что сеть не ищет эту функцию: o

Спасибо за помощь! Привет

1 Ответ

0 голосов
/ 02 июля 2018

Вы можете легко добавить прослушиватель событий, чтобы определить, когда удерживается клавиша пробела. Однако затем вам нужно будет каким-то образом указать карте, в каком направлении двигаться. Предполагая, что вы хотите, чтобы это делалось также с помощью клавиатуры, вот несколько примеров кода для добавления / удаления прокрутки с помощью клавиш со стрелками, когда удерживается клавиша пробела. вниз. 

function scrollMap(e) {
  const key = e.key;
  if (key == 'ArrowUp'){
   //scroll map 100px up, or whatever you want
  }
  //repeat for other arrow keys, or inputs of your choice
}

document.addEventListener('keydown', (event) => {
  const key = event.code;
  if (key == 'Space'){
    listen();
  }
 });

document.addEventListener('keyup', (event) => {
  const key = event.code;
  if (key == 'Space'){
    stopListen();
   }
 });

function listen(){
  document.addEventListener('keypress', scrollMap);      
}

function stopListen(){
   document.removeEventListener('keypress', scrollMap);
}

Примечания

1) В зависимости от макета страницы может быть лучше прикрепить события к элементу карты, а не к документу

2) Выбор event.code против event.key и т. Д. Будет зависеть от того, на какие браузеры вы ориентируетесь. См. здесь для получения дополнительной информации

3) Вместо пробела вы можете использовать shift / ctrl / alt, так как они встроены в события клавиатуры и поэтому их легче обнаружить и использовать кросс-браузер. См. здесь для получения дополнительной информации

...