не меняйте значок мыши при наведении на маркер - PullRequest
0 голосов
/ 10 марта 2020

У меня есть карта с количеством маркеров. Когда пользователь нажимает на один маркер, информация о нем отображается на боковой панели. Для достижения sh того, что я добавил «маркеры» слушателей к маркерам, а также сохранил идентификаторы маркеров более или менее, как предложено в этом SO-ответе .

Теперь, в некоторых режимах я не надеваю не хочу, чтобы маркеры были кликабельными (но все же хотят, чтобы они появлялись на экране). Мне легко удалить всех слушателей «щелчка». Однако, когда я наводю на них курсор мыши, значок меняется с «открытой ладони» на «заостренную руку», сбивая пользователя с толку. После изучения я вижу, что класс canvas обычно имеет класс leaflet-zoom-animated, но когда я наведу курсор на маркер, добавляется класс leaflet-interactive. Я могу изменить этот курсор с помощью, например:

.leaflet-interactive {
    cursor: crosshair !important;
}

... но это имеет две проблемы:

  1. это не то, что я могу включать и выключать в зависимости от различных пользователей режимы взаимодействия, в которых мое приложение обнаруживает себя в
  2. , оно по-прежнему раздражает, потому что курсор меняется, и, кроме того, я не могу изменить его на курсор с открытой ладонью, который обычно использует Leaflet, так как это курсор не по умолчанию и мне не понятно, как получить к нему доступ.

Ответы [ 2 ]

1 голос
/ 10 марта 2020

Если вы можете удалить прослушиватель кликов, я полагаю, что вы также можете добавить класс css к своему маркеру. Вот пример http://jsfiddle.net/Mossart/w9830at1/7/ (посмотрите на верхний маркер)

var breakside = [45.571601194035345, -122.65673562884331];
var marker1 = L.marker(breakside).addTo(map);
marker1._icon.classList.add("not-clickable");

CSS:

.not-clickable {
  cursor: grab;
}
0 голосов
/ 11 марта 2020

Это работает для L.circleMarker объектов на рендере холста:

marker.options.interactive = false;

Любопытно, что на рендерере без холста это не работает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...