Блог

Главная - Вопросы по программированию - Как я могу добавить функцию «Лететь к маркеру» к существующей кнопке? [Карты листовок]

Как я могу добавить функцию «Лететь к маркеру» к существующей кнопке? [Карты листовок]

#javascript #html #css #onclick #leaflet

#javascript #HTML #css #onclick #листовка

Вопрос:

Я пытаюсь добавить функцию перехода к маркеру на кнопке. Я создал несколько кнопок справа, и я хотел бы добавить эту функцию к одной кнопке.

  var latlng = map.getCenter(); // or [47.478058, 9.720154]
var marker = L.marker(latlng).addTo(map);
L.DomEvent.on(button,'click',function(){
    var zoomlvl = 16;
    map.flyTo(marker.getLatLng(),zoomlvl)
});

Я просто хочу добавить это в свой код —> https://jsfiddle.net/paulito92/p92sfz7o/1/
Например, на кнопке зоны доступности.
Я бы хотел, чтобы при нажатии на кнопку карта отображалась в этом конкретном месте [48.6333, 2.2333]
Я всегда сталкиваюсь с проблемой, когда пытаюсь добавить функцию.

Если кто-нибудь знает, как это сделать, было бы ооочень приятно!

Всем спасибо, хорошего дня 🙂

Ответ №1:

Добавьте событие buttons в конец скрипта или после создания маркера. Также вы должны использовать переменную myDataPoint вместо неопределенной переменной marker 

   
  var button = document.getElementById('availability')
L.DomEvent.on(button,'click',function(e){
    console.log('Button clicked')
});

L.DomEvent.on(button,'click',function(){
    var zoomlvl = 16;
    map.flyTo(myDataPoint.getLatLng(),zoomlvl)
});

https://jsfiddle.net/falkedesign/f3etmzjn/