Как закрыть открытое окно Google Maps, нажав на маркер еще раз - PullRequest
Новая
       6

Как закрыть открытое окно Google Maps, нажав на маркер еще раз

0 голосов
/ 10 января 2020

Я пытаюсь закрыть открытое информационное окно Google Maps, снова щелкнув маркер. В настоящее время есть только вопросы о том, как закрыть всю остальную информацию windows при нажатии на карту или другие маркеры.

Как закрыть открытое информационное окно Google Maps, снова щелкнув по тому же маркеру? В настоящее время я могу закрыть только информационное окно, щелкнув крестик в верхнем правом углу информационного окна.

Это то, что я пробовал, но оно даже не открывает информационное окно: 

    EncoreMarker.addListener('click', function () {
        if (EncoreInfoCard.open) {
            EncoreInfoCard.close(map, EncoreMarker);
        }
        else {
            EncoreInfoCard.open(map, EncoreMarker);
        }               
    });

1 Ответ

0 голосов
/ 10 января 2020

Ваш код не будет работать, потому что open - это функция, которая открывает InfoWindow, а не boolean, которая сообщает, открыт он или нет.

Это работает для меня: 

EncoreMarker.addListener('click', function () {
    // create a custom property of the InfoWindow, defaults to a value that evaluates as false
    if (EncoreInfoCard.isOpen) { 
        EncoreInfoCard.close(map, EncoreMarker);
        EncoreInfoCard.isOpen = false;
    }
    else {
        EncoreInfoCard.open(map, EncoreMarker);
        EncoreInfoCard.isOpen = true;
    }               
});

подтверждение концепции скрипта

фрагмент кода: 

// This example displays a marker at the center of Australia.
// When the user clicks the marker, an info window opens.
// When the user clicks the makrer again, the info window closes.

function initMap() {
  var uluru = {
    lat: -25.363,
    lng: 131.044
  };
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru
  });

  var EncoreInfoCard = new google.maps.InfoWindow({
    content: "<b>This is a Test</b>"
  });
  google.maps.event.addListener(EncoreInfoCard, 'closeclick', function() {
    EncoreInfoCard.isOpen = false;
  });
  var EncoreMarker = new google.maps.Marker({
    position: uluru,
    map: map,
    title: 'Uluru (Ayers Rock)'
  });

  EncoreMarker.addListener('click', function() {
    if (EncoreInfoCard.isOpen) {
      EncoreInfoCard.close(map, EncoreMarker);
      EncoreInfoCard.isOpen = false;
    } else {
      EncoreInfoCard.open(map, EncoreMarker);
      EncoreInfoCard.isOpen = true;
    }
  });
}
/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */

#map {
  height: 100%;
}


/* Optional: Makes the sample page fill the window. */

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>
...