Overlay close on click event (Sorry, one overlay at a time please!)

[jeffj]

I am trying to close existing overlays when a user clicks on a new marker on my map. I've tried every which way to tuesday.


var markers = {};
// These are all Google Maps APIs
var addMarker = function(entry) {


// if (marker[entry.id.$t]) {
// return;
// }
var pos = entry.content.kml$Placemark[0].kml$Point[0].kml$coordinates[0].$t.split(',');


var marker = new google.maps.Marker({
map: map.map,
title: 'whatever',
clickable: true,
position: new google.maps.LatLng(pos[1], pos[0]),
Icon: entry.gd$customProperty[4].$t
});

var overlay = new google.maps.InfoWindow({
content: entry.gd$customProperty[0].$t

});

google.maps.event.addListener(marker, "click", function() {

overlay.close();

overlay.open(map.map, marker);
});

// }
};

[jeffj]

Found a solution I completely don't understand. I needed to place the var for new google.maps.InfoWindow(); outside the anonymous function "var addMarker = function(whatever)"

http://github.com/nelstrom/GeoTweets/blob/5b6db3cf0850861d008ca4e5b1c1a57b31bc1afd/javascripts/geotweets.js




var pos = entry.content.kml$Placemark[0].kml$Point[0].kml$coordinates[0].$t.split(',');


var marker = new google.maps.Marker({
map: map.map,
title: 'whatever',
clickable: true,
position: new google.maps.LatLng(pos[1], pos[0]),
Icon: entry.gd$customProperty[4].$t
});



google.maps.event.addListener(marker, "click", function() {
tweetBubble.setContent(entry.gd$customProperty[0].$t);
tweetBubble.open(map.map, marker);
});

};

// I have no clue why I need to define tweetbubble outside var add marker (cite: http://github.com/nelstrom/GeoTweets/blob/5b6db3cf0850861d008ca4e5b1c1a57b31bc1afd/javascripts/geotweets.js_
tweetBubble = new google.maps.InfoWindow(
);

[nelstrom]

It's a bit confusing isn't it? Here's the section in the Google Maps Reference on the InfoWindow class (http://code.google.com/apis/maps/documentation/javascript/reference.html#InfoWindow). They don't really explain it there, but as I understand it, if you want to only show a single InfoWindow you must only create a single InfoWindow. The click handler on each marker then sets the content for that single instance of an InfoWindow, then opens it. Because you only have a single InfoWindow, the currently visible one will disappear, and the new one will appear with the new content.