the following code which is mainly lifted from the Google tutorial and changed infowindows to infoboxes works like this.
Loads & Opens all infoboxes correctly.
Closes infoboxes when clicked on close icon.
Will not Open any infobox when clicking marker, except the last marker added to the map (which is the last in the array if that helps).
I've tried several options but am having no luck getting the infobox to open again, except for the last added marker, please help me.
function load() {
var map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: 'roadmap',
scrollwheel: false
});
google.maps.event.addListener(map, "click", function() { ib.close() });
var ib = new InfoBox();
var bounds = new google.maps.LatLngBounds();
// Change this depending on the name of your PHP file
downloadUrl("phpsqlajax_genxml2.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var marker = new google.maps.Marker({
map: map,
position: point
});
bounds.extend(marker.position);
var boxText = document.createElement("div");
boxText.innerHTML = "<b>" + name + "</b> <br/><div id='station_data'><h2>Station Down</h2></div>";;
var myOptions = {
content: boxText
,disableAutoPan: false
,maxWidth: 0
,pixelOffset: new google.maps.Size(-140, 0)
,zIndex: null
,boxStyle: {
width: "280px"
}
,closeBoxMargin: "-10px -10px 0px 0px"
,closeBoxURL: "close_icon.png"
,infoBoxClearance: new google.maps.Size(1, 1)
,isHidden: false
,pane: "floatPane"
,enableEventPropagation: false
};
var ib = new InfoBox(myOptions);
ib.open(map, marker);
google.maps.event.addListener(marker, 'click', function() {
ib.open(map, marker);
});
}
map.fitBounds(bounds);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
//]]>