Как я могу имитировать стиль всплывающей подсказки Leaflet.Draw с помощью другого плагина всплывающей подсказки?

Я пытаюсь реализовать поведение, подобное leaflet.draw, на карте, которая также использует leaflet.draw (используя Draw для удаления маркеров, а затем настраиваемые js для рисования маршрутов). Поэтому я хотел бы, чтобы полезные всплывающие подсказки для этой пользовательской функции рисования выглядели как всплывающие подсказки рисования.

Как я могу это сделать? В настоящее время я использую jquery-ui v. 1.11.4, и я не могу понять, как сделать внешний вид одинаковым. Я нашел соответствующий раздел css из leaflet.draw, но при попытке использовать свойство tooltipclass в конструктора, как показано ниже (из здесь), два класса leaflet.draw были добавлены во всплывающую подсказку (и, по-видимому, переопределены существующими класс jquery-ui).

$( ".selector" ).tooltip({
  tooltipClass: ".leaflet-draw-tooltip .leaflet-draw-tooltip-single"
});

Возможны два решения:
1. Создать собственный экземпляр подсказка leaflet.draw
2. Найдите способ удалить конфликтующие классы CSS из всплывающей подсказки jquery-ui.


javascript css tooltip leaflet.draw jquery-ui
person raphael    schedule 26.01.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Итак, проблема заключалась в том, что leaflet.draw.css содержал следующее свойство:

visibility: hidden ;

Поэтому всякий раз, когда я успешно применяю CSS leaflet.draw к всплывающей подсказке, она исчезает! (Трудно отлаживать).

Поэтому я создал класс для переопределения свойства visibility и добавил его в объявление всплывающей подсказки:

.j-leaflet-draw-tooltip{
    visibility: visible;
}

$( "#map" ).tooltip({
    tooltipClass: "leaflet-draw-tooltip leaflet-draw-tooltip-single
                   j-leaflet-draw-tooltip"
});
person raphael    schedule 28.01.2016