单击标记时如何关闭所有打开的信息窗口?

时间:2012-11-23 20:06:20

标签: javascript google-maps google-maps-api-3 infowindow

  

可能重复:
  Google maps: infowindow is not closing

我花了好几个小时试图了解如何做到这一点,但似乎没有更接近解决方案。请参阅下面的代码:

function initialize() {
var latlng = new google.maps.LatLng(50.71608,-1.993761);
var settings = {
        zoom: 14,
        center: latlng,
        mapTypeControl: true,
        mapTypeControlOptions: {style: 
        google.maps.MapTypeControlStyle.DROPDOWN_MENU},
        navigationControl: true,
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
        mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),      settings);

var contentString = '<div>'+
              '<p><strong>name</strong></p>'+
                '</div>';
var infowindow = new google.maps.InfoWindow({
                content: contentString
            });
var contentString2 = '<div>'+
              '<p><strong>name</strong></p>'+
                '</div>';
var infowindow2 = new google.maps.InfoWindow({
                content: contentString2
            });
var contentString3 = '<div>'+
              '<p><strong>name</strong></p>'+
                '</div>';
var infowindow3 = new google.maps.InfoWindow({
                content: contentString3
            });

var oldIcon = new google.maps.MarkerImage('images/maplogo.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var oldShadow = new google.maps.MarkerImage('images/mapshadow.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50, 50)
    );
    var old = new google.maps.LatLng(50.714110196782485,-1.9864332675933838, 3);
    var oldMarker = new google.maps.Marker({
        position: old,
        map: map,
        icon: oldIcon,
        shadow: oldShadow,
        title:"title",
        animation: google.maps.Animation.DROP
    });


    var hamIcon = new google.maps.MarkerImage('images/maplogo.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var hamShadow = new google.maps.MarkerImage('images/mapshadow.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var ham = new google.maps.LatLng(50.71584417870842,-2.006630301475525, 1);

    var hamMarker = new google.maps.Marker({
        position: ham,
        map: map,
        icon: hamIcon,
        shadow: hamShadow,
        title:"title",
        animation: google.maps.Animation.DROP
    });

var centreIcon = new google.maps.MarkerImage('images/maplogo.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var centreShadow = new google.maps.MarkerImage('images/mapshadow.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var centre = new google.maps.LatLng(50.71712636698597,-1.9832682609558105, 2);
    var centreMarker = new google.maps.Marker({
        position: centre,
        map: map,
        icon: centreIcon,
        shadow: centreShadow,
        title:"title",
        animation: google.maps.Animation.DROP
    }); 

            google.maps.event.addListener(oldMarker, 'click', function() {
    infowindow.open(map,oldMarker);
    });
            google.maps.event.addListener(hamMarker, 'click', function() {
    infowindow2.open(map,hamMarker);
    });
            google.maps.event.addListener(centreMarker, 'click', function() {
    infowindow3.open(map,centreMarker);
    });
    }   

任何有关此方面的帮助都会非常感激,因为我有一个满足的最后期限和对javascript的非常低的理解。

谢谢

1 个答案:

答案 0 :(得分:0)

infowindow.close()回调中致电click

您应该能够用以下内容替换您的听众:

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

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

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