如何使功能隐藏和显示信息标记

时间:2014-02-14 04:20:58

标签: javascript function google-maps

我需要一个复选框来获取隐藏和显示标记或一组标记的功能

由于某种原因idk(我是谷歌地图api的新手)这个功能不适用于infobubbles,当我尝试使用infowindow它有效..任何帮助?谢谢

    var map;

  function init() {

    var mapCenter = new google.maps.LatLng(-22.967956,-43.197397);
    map = new google.maps.Map(document.getElementById('map'), {
      zoom: 14,
      center: mapCenter,
      streetViewControl: true,
      mapTypeControl: true,
      mapLabels:true,
      mapTypeId: google.maps.MapTypeId.HYBRID
    });

    var myLatLng = new google.maps.LatLng(-22.973878,-43.192564);
    var myLatLng1 = new google.maps.LatLng(-22.968373,-43.183176);

    var marker = new google.maps.Marker({
      map: map,
      position: myLatLng,
      title: 'marker'
     });

     var marker1 = new google.maps.Marker({
      map: map,
      position: myLatLng1,
      title: 'marker1'
     });

     infoBubble = new InfoBubble({
      maxWidth: 246,
      maxHeight: 350


    });

    infoBubble.addTab('home', contenthome);
    infoBubble.addTab('Info', content);
    infoBubble.addTab('Fase', contentString);

    google.maps.event.addListener(marker, 'click', infobut); 

    function infobut(event) {

             if (!infoBubble.isOpen()) {
        infoBubble.open(map, marker);          }
        }

    infoBubble1 = new InfoBubble({
       maxWidth: 246,
      maxHeight: 350

    });

    infoBubble1.addTab('home', contenthome);
    infoBubble1.addTab('Info', content);
    infoBubble1.addTab('Fase', contentString);

    google.maps.event.addListener(marker1, 'click', infobut1); 

    function infobut1(event) {

             if (!infoBubble1.isOpen()) {
        infoBubble1.open(map, marker1);         }
    }

    function hidemarker() {
            marker1.setVisible(false);
          }

和按钮

       <input type="checkbox" onClick="hidemarker()" name="1qts" value="1 Quartos" class="botao2">

1 个答案:

答案 0 :(得分:0)

从您的代码中不清楚init()函数的完成位置。我在}函数之前放置了hidemarker()。问题是变量marker1不可见,它应该像变量map一样全局化。

要关闭信息气泡,只需调用方法close()

var map;

var marker1;

function init() {
    ...
    marker1 = new google.maps.Marker({
        map: map,
        position: myLatLng1,
        title: 'marker1'
    });
    ...
}

function hidemarker() {
    infoBubble1.close();
    marker1.setVisible(false);
}

google.maps.event.addDomListener(window, 'load', init);