关闭InfoWindow - 关闭onclick - 谷歌地图

时间:2011-06-17 20:31:06

标签: javascript google-maps

我不能让我的生活中只有一个infoWindow一次显示在API的V3中。我需要一个在下一次开幕前关闭。还希望在地图上的任何地方关闭infoWindow。这是否在初始化函数内?

这是我的完整脚本:

// defining vars
var map = null;
var markers = [];
var adUnit;
var center = new google.maps.LatLng(39.676502,-105.162101);

// function that soley initializes the new map object
function initialize() {

    var mapOptions = {
        zoom: 10,
        center: center,
            mapTypeControl: true,
            mapTypeControlOptions: {
              style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
            },
            zoomControl: true,
                    zoomControlOptions: {
                      style: google.maps.ZoomControlStyle.SMALL,
                      position: google.maps.ControlPosition.LEFT_BOTTOM
                    },
            panControl: false,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    }
    map = new google.maps.Map($('#map_canvas')[0], mapOptions);
    // call the loader function
    loadXML();

    // Adsense Options                                 
    var adUnitDiv = document.createElement('div');
    var adUnitOptions = {
      format: google.maps.adsense.AdFormat.BUTTON,
      position: google.maps.ControlPosition.RIGHT_BOTTOM,
      publisherId: 'ca-google-maps_apidocs',
      map: map,
      visible: true
    };
    adUnit = new google.maps.adsense.AdUnit(adUnitDiv, adUnitOptions);     

      google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });                       


} //<-- Initialize

// load (and map) the markers from XML data
function loadXML() {
    $.get('data.xml', function(data) {
        // var bounds = new google.maps.LatLngBounds();   //<--- Size map to bounds of markers LatLng
        $(data).find('marker').each(function() {

            var lat = $(this).attr('lat')
            var lng = $(this).attr('lng')
            var name = $(this).attr('name')
            var type = $(this).attr('type')

            var LatLng   = new google.maps.LatLng(parseFloat($(this).attr('lat')),
                                    parseFloat($(this).attr('lng')));

            var myToggleData = {                    //<---- collecting data to be toggled on/off
                type      : $(this).attr('type'),
                skill         : $(this).attr('skill'),
                eta_whatever_that_means : parseFloat($(this).attr('eta'))
            }        

            var marker      = new google.maps.Marker({
                position : LatLng,
                map         : map,
                icon     : 'images/marker.png',
                title     : $(this).attr('name'),
                data     : myToggleData
            });

              var html ='<div id="winBackground">          <div class="winTitle">' + name + '</div>          <div class="winHead">Type: <div class="winData">' + type + '</div></div>   </div>';


              // create the infoWindow
              var infoWindow = new google.maps.InfoWindow();
              // add a listener to open the infoWindow when a user clicks on one of the markers
              google.maps.event.addListener(marker, 'click', function() {
                infoWindow.setContent(html);
                infoWindow.open(map, marker);
              });

            markers.push(marker);
            // bounds.extend(LatLng);
        });


        // map.fitBounds(bounds);
    });
}
// The toggleMarker function
function toggleMarkers(attr,val) {
    if (markers){
        for (i in markers) {
            if(markers[i].data[attr] == val){
                var visibility = (markers[i].getVisible() == true) ? false : true;
                markers[i].setVisible(visibility);
            }
        }
    }
}

4 个答案:

答案 0 :(得分:6)

不要为每个标记创建新的InfoWindow。只创建一个InfoWindow,然后在更改时,执行以下操作:

infowin.setContent("");
infowin.open(map, marker);

答案 1 :(得分:2)

这将关闭地图上的所有infoWindows点击(无需引用infoWindow对象)。

google.maps.event.addListener( map, 'click', function() { 
    infowindow.open( null, null ); 
} );

答案 2 :(得分:2)

   google.maps.event.addListener(marker, 'click', function() {
        if(!marker.open){
            infowindow.open(map,marker);
            marker.open = true;
        }
        else{
            infowindow.close();
            marker.open = false;
        }
        google.maps.event.addListener(map, 'click', function() {
            infowindow.close();
            marker.open = false;
        });
    });

试试这个会起作用

答案 3 :(得分:0)

尝试这样的事情:

if(popup) {
    popup.close();
}

popup = new google.maps.InfoWindow({
    content:'My New InfoWindow',
});

popup.open(map, marker);