Скрыть InfoWindow перед применением пользовательских стилей - PullRequest
Новая
       23

Скрыть InfoWindow перед применением пользовательских стилей

0 голосов
/ 12 декабря 2018

Я использую Google Maps API InfoWindow и настраиваю пользовательские классы с помощью javascript. 

 this.infoWindow.addEventListener("domready", this.handleContentReady);

 handleContentReady = () => {
   document.getElementsByClassName("gm-style-iw")[0]
     .parentElement
     .classList
     .add("custom-iw")
 }

Проблема в том, что при первой загрузке infoWindow это не такУ меня еще есть пользовательские стили, поэтому он переходит от стандартных к моим пользовательским стилям

Есть ли способ скрыть информационное окно перед применением пользовательских стилей?

Ответы [ 2 ]

0 голосов
/ 12 декабря 2018

Хорошо, я нашел ответ

Решение состоит в том, чтобы установить pixelOffset для infoWindow как внешнюю карту до открытия окна 

this.infoWindow.setOptions({ pixelOffset: new google.maps.Size(0, 2000) })
this.infoWindow.open(this.props.mapInstance, this.props.marker);

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

handleContentReady = () => {
  document.getElementsByClassName("gm-style-iw")[0]
    .parentElement
    .classList
    .add("custom-iw")
  this.infoWindow.setOptions({ pixelOffset: new google.maps.Size(0, 0) })
}
0 голосов
/ 12 декабря 2018

Я бы использовал CSS для расширения стилей для gm-style-iw 

.gm-style-iw {
  visibility: hidden;
}

Затем для custom-iw 

.custom-iw {
  visibility: visible;
}

Будет добавлен класс custom-iw , он перезапишет visibility из gm-style-iw .

...