Удалить многоугольник с карты буклета нажатием кнопки

У меня есть карта листовок, которые содержат несколько многоугольников. Я добавляю многоугольники на карту, как это

L.polygon([lat,lng]).addTo(map)

Также я могу нарисовать многоугольник на карте листовки. Теперь я хочу удалить определенный многоугольник при нажатии кнопки в машинописном тексте angular. Как я могу добиться этой функциональности? Пожалуйста помоги.


person Hunzla Sheikh    schedule 03.03.2020    source источник


Ответы (1)


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

const polygon = L.polygon([lat, lng]).addTo(map);
polygon.on('click', function () {
  polygon.remove();
});
person Dipen Shah    schedule 03.03.2020
comment
Это сработало. Но как я могу определить тот полигон, который пользователь хочет удалить? Существует ли какое-либо событие щелчка по полигону? Например, если пользователь сначала нажимает кнопку удаления, а затем щелкает многоугольник, и этот многоугольник будет удален? - person Hunzla Sheikh; 03.03.2020
comment
@HunzlaSheikh Это зависит от поведения вашего пользовательского интерфейса. Если вы хотите, чтобы пользователь сначала нажимал кнопку, а затем удалял все полигоны, которые пользователь нажимает, вы можете это сделать. - person Dipen Shah; 03.03.2020
comment
Хорошо спасибо. Также у вас есть идеи, как удалить конкретный многоугольник, который я рисую? Например, this.polygonDrawer = new L.Draw.Polygon (this.map); Как мне это удалить? В настоящее время я использую функцию clearLayers, но она удаляет все слои / полигоны, и я хочу удалить определенный слой? - person Hunzla Sheikh; 03.03.2020
comment
Вы можете добавить кнопку-переключатель в свой пользовательский интерфейс, когда кнопка активна, тогда пользователь может удалить любой многоугольник, иначе никакое событие или какая-либо другая функция (например, всплывающее окно) не запускается по щелчку многоугольника. - person saadat ali; 06.03.2020