@danilr

Как в API 2gis понять попап какого маркера открыт чтобы его программно закрыть?

Не понимаю как сделать так, чтобы когда открыт попап маркера - при нажатии на нужную мне кнопку закрыть его. Как то Vue должен знать об открытом попапе, чтобы закрыть именно его.
Также нужно, чтобы при нажатии на некую карточку - открывался нужный попап, связанный с ней скажем по id.
Здесь создаю карту и маркеры:
this.markers = DG.featureGroup()
    this.popups = DG.featureGroup()
this.map = DG.map("map", {
	center: [54.98, 82.89],
          zoom: 13,
          minZoom: 7
	});
		this.getUsersinGroup()
			.then(response => {
        this.residentials.forEach(residential =>{
	let myDivIcon = DG.divIcon({
                    iconSize: [30, 30],
                    className: 'marker-custom',
                    html:  `<div class="marker-wrapper" data-id="${data.id}">
                    <div class="mini-marker-wrapper">
                      <div class="mini-marker"></div>
                    </div>
                    <div class="marker-info-wrapper">
                      <div class="marker-title">${data.title}</div>
                      <div class="marker-price">от ${priceMinFormatted} ₽</div>
                      <div class="marker-decor"></div>
                    </div>
                  </div>`
                  });

                  this.pointPopup = DG.point(0, 1);

                   this.popupMap = DG.popup({
                    className: 'test-name',
                    closeButton: false,
                    offset: this.pointPopup,
                    setZoomMarker: false
                  })
                    .setContent(`<div class="marker-wrapper" data-id="${data.id}">
                    <div class="mini-marker-wrapper">
                      <div class="mini-marker"></div>
                    </div>
                    <div class="marker-info-wrapper">
                      <div class="marker-title">${data.title}</div>
                      <div class="marker-price">от ${priceMinFormatted} ₽</div>
                      <div class="marker-decor"></div>
                    </div>
                  </div>`)

          this.coordinates = [residential.latitude, residential.longitude];
          DG.marker(this.coordinates, { icon: myDivIcon }).addTo(this.markers)
          .bindPopup(this.popupMap)
        })
         this.markers.addTo(this.map);
  • Вопрос задан
  • 375 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Не надо ничего понимать - this.map.closePopup().

UPD. Вынесено из комментариев:

А если открыты несколько попапов разных маркеров? <...> как можно открыть необходимый попап маркера (без нажатия на сам маркер конечно)

https://jsfiddle.net/Lmkbq54p/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы