Close infowindow when another marker is clicked

Question

I have the following code to open an infowindow when a specific marker is click and it open a window. Does anyone know how to close the previous infowindow when another one is clicked?.

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

Answer 1

Just make sure you only create ONE infoWindow in the global scope, like this:

infoWindow = new google.maps.InfoWindow; //static infoWindow for all your markers
google.maps.event.addDomListener(window, 'load', function() {
   //create your markers here
   google.maps.event.addListener(marker, 'click', function() {
               infoWindow.open(map1, marker); //take care with case-sensitiveness
          });
});

UPDATE:

• Fix case sensitive spotted by Duncan.
• Illustrate the marker click handlers must be connected after marker creation, both inside page load event.

Answer 2

Create a global variable in your JS file, name it lastOpenedInfoWindow or whatever you want, after that close it before opening a new info window, assign the "lastOpenedInfoWindow" to the currently opened window and so on

google.maps.event.addListener(marker, 'click', (function(marker, content, infowindow) {
        return function() {
            closeLastOpenedInfoWindow();
            infowindow.setContent(content);
            infowindow.open(map, marker);
            lastOpenedInfoWindow = infowindow;
        };
    })(marker, makrerdata[i], infowindow));
}


function closeLastOpenedInfoWindow() {
    if (lastOpenedInfoWindow) {
        lastOpenedInfoWindow.close();
    }
}