Question

我在google地图上工作。在我的地图中，有两个标记。我藏了他们我想用我已经制作的按钮来切换这两个标记。

我之前使用另一种脚本切换功能，但这里不起作用！谢谢你的帮助！

var map;
var markers;

function initMap() {


   var bounds = new google.maps.LatLngBounds();
   var mapOptions = {
      mapTypeId: 'roadmap'
   };

   var nepal = {
      lat: 28.240381,
      lng: 83.973038
   };
   map = new google.maps.Map(document.getElementById('nepal_map'), {
      zoom: 7,
      center: nepal
   });

   var markers = [
      ['Lobuche', 27.955762, 86.794760],
      ['Island', 27.919593, 86.934933]
   ];

   var infoWindowContent = [
      ['Lobuche!!!'],
      ['Island!!!']
   ];

   // Display multiple markers on a map
   var infoWindow = new google.maps.InfoWindow(),
      marker, i;

   // Loop through our array of markers & place each one on the map  
   for (i = 0; i < markers.length; i++) {

      var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
      bounds.extend(position);
      marker = new google.maps.Marker({
         position: position,
         map: map,
         visible: (false)
      });

      // Allow each marker to have an info window    
      google.maps.event.addListener(marker, 'click', (function(marker, i) {
         return function() {
            infoWindow.setContent(infoWindowContent[i][0]);
            infoWindow.open(map, marker);
         }
      })(marker, i));

      // Automatically center the map fitting all markers on the screen
      map.fitBounds(bounds);
   }

   // Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
   var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
      this.setZoom(7);
      google.maps.event.removeListener(boundsListener);
   });

}

function toggleMarkers() {
   if (markers[0].getMap() != null) {
      var arg = null;
   } else {
      var arg = map;
   }
   for (var i = 0; i < markers.length; i++) {
      markers[i].setMap(arg);
   }
}

Answer 1

设置标记可见性的功能是：

marker.setVisible(true);
marker.setVisible(false);

您可以使用以下方法检查标记是否可见：

if(marker.getVisible() == true)

我已经创建了一个JSFiddle来为您演示这个。地图以两个不可见标记开始，顶部有一个按钮来切换标记。单击该按钮可使其可见。再次单击会关闭可见性等。

注意：由于您使用的是已经制作的按钮而我没有代码，因此我使用了自己的按钮。尽管使用自己的按钮，逻辑应该是相同的。请看这里的小提琴：

https://jsfiddle.net/jcumhbnw/

注意：您需要将自己的API密钥插入我的小提琴才能使其正常工作。

我希望这有帮助！

谷歌地图API中的切换按钮

1 个答案: