Как скрыть маркеры API Карт Google с помощью jQuery - PullRequest
Новая
       7

Как скрыть маркеры API Карт Google с помощью jQuery

22 голосов
/ 07 марта 2012

Здравствуйте, это может быть очень глупый вопрос, но я пытаюсь заставить маркеры исчезать, когда они нажали. Маркер правильно расположен на карте, но когда я нажимаю на него, он не Делать что-нибудь. Мне было интересно, почему это не работает. Спасибо! 

  <script type="text/javascript" src="jQuery.js"></script>
  <script type="text/javascript">

  $(document).ready(function(){
      var myOptions = {
        center: new google.maps.LatLng(40.1, -88.2),
        zoom: 13,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      var myLatlng = new google.maps.LatLng(40.1, -88.2);
      var temp_marker = new google.maps.Marker({
          position: myLatlng,
          map: map,
          title:"Hello World!"
        });

      console.log($(temp_marker));
      console.log(temp_marker);

      //temp_marker.click(function(){$(this).hide();});

      $(temp_marker).click(function(){console.log("click is working"); $(this).hide();});
          });
  </script>
</head>
<body>
  <div id="map_canvas" style="width:100%; height:100%"></div>
</body>

Ответы [ 6 ]

58 голосов
/ 07 марта 2012

temp_marker - это объект Javascript, а не элемент DOM.Чтобы прикрепить прослушиватель к маркеру (API будет обрабатывать специфику, к какому элементу DOM подключаться и как), вы должны использовать собственную систему событий API Карт Google, например: 

  google.maps.event.addListener(marker, 'click', function() {
    marker.setVisible(false); // maps API hide call
  });

Их документация: API Карт Google Javascript v3 - События

4 голосов
/ 23 мая 2014

Расширяя заметки Бена, это должно идти туда, где вы объявили свой маркер - например: 

var beachMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  icon: image
});
google.maps.event.addListener(beachMarker, 'click', function() {
  beachMarker.setVisible(false); // maps API hide call
});
}

Мне потребовались целые годы, чтобы понять это.Огромный кредит Бену!Спасибо!

3 голосов
/ 07 марта 2012

Бен дал тебе половину ответа.Как только вы сможете обнаружить событие щелчка маркера, вам нужно «спрятать» или удалить маркер с карты.Стандартный способ сделать это с помощью Google Maps заключается в следующем: 

this.setMap(null);

Затем вы можете снова показать карту, используя setMap для назначения объекта карты вместо нуля.

1 голос
/ 07 марта 2012

marker - это объект карт Google, а не элемент DOM. Jquery работает с DOM-элементами.

0 голосов
/ 21 июня 2018

Вы можете показать маркер, установив видимость true, и скрыть его, установив видимость false

marker.setVisible(false); // hide the marker
0 голосов
/ 07 марта 2012

Я не уверен, что вы можете просто спрятать маркер, но подходящим крючком для события click будет сделать что-то подобное, когда вы объявите marker

google.maps.event.addListener(marker, 'click', function() {
    // do your hide here
});

Возможно, вам придется убрать маркер с карты, а не «скрывать» его.

Для чего вы пытаетесь скрыть маркеры? Вы должны быть в состоянии повторно показать маркер? Как вы планируете достичь этого?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...