如何使用jQuery隐藏Google Maps Api Markers

Question

如何使用jQuery隐藏Google Maps Api Markers

way*_*are 23 jquery google-maps google-maps-api-3

您好,这可能是一个非常愚蠢的问题,但我想在点击它们时让标记消失.标记位于地图上,但是当我点击它时,它没有做任何事情.我想知道它为什么不起作用.谢谢!

  <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>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Ben*_*pan 58

temp_marker是一个Javascript对象,而不是DOM元素.要将侦听器附加到标记(API将处理要附加到哪个DOM元素的细节以及如何处理),您应该使用Google Maps API自己的事件系统,如:

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

Run Code Online (Sandbox Code Playgroud)

他们的文档:Google Maps Javascript API v3 - Events

@wayfare Maps API在为标记和实现者创建的DOM元素之间放置了一层抽象.可能有直接访问DOM元素的技巧,但是没有支持的路径.一旦谷歌地图做出内部改变,任何直接摆弄这些元素的企图都会受到破坏; 它也可能无法跨浏览器工作. (2认同)

归档时间：	13 年，8 月前
查看次数：	53516 次
最近记录：	6 年，2 月前