Hi!
I'm using the very smart InfoBox extension created by Gary Little
(http://google-maps-utility-library-v3.googlecode.com/svn/trunk/
infobox/docs/reference.html), and I've run into a problem with
creating/showing the InfoBox objects. I'm not very familiar with the
DOM behind-the-scenes, but I guess my problem is related to this. I
have a function that looks like this (greatly simplified):
function toggleMarkers() {
// Check if the markers are loaded into markersArray
if (markersArray.length == 0) {
loadMarkers();
}
// Check if the markers (i.e. the first one) is shown, if not,
// then show the markers and the associated infoboxes
if (markersArray(0).getMap() == null) {
for (var x=0;x<markersArray.length;x++) {
markersArray[x].setMap(map);
infoBoxArray[x].show();
}
} else {
for (var x=0;x<markersArray.length;x++) {
markersArray[x].setMap(null);
infoBoxArray[x].hide();
}
}
}
Problem:
First time toggleMarkers() is being called, it only shows the first
marker and the first InfoBox. The error message I get from IE6 is
"'this.div_.style' is null or not an object", and it points to line
633 which is an empty row the map html file. The second time
toggleMarkers() is being called, the marker disappears as it is
intended to do. Third time it is being called, all the markers are
shown and also their associated infoboxes.
Why I think it's related to InfoBox:
When I delete the InfoBox lines, i.e. "markersLabelArray[x].show();"
and "markersLabelArray[x].hide();", everything works just fine! First
time toggleMarkers() is being called, it shows all the markers. It
seems that when I run the function the first time, the script is
trying to do the markersLabelArray[x].show(); before the InfoBox
objects even are created. But that is somehow weird, because the
markers and the InfoBoxes should be created before the loop? How is
this possible?
Also; I looked up line 633 in infobox.js, and it was the last line of
this function:
/**
* Shows the InfoBox.
*/
InfoBox.prototype.show = function () {
this.isHidden_ = false;
this.div_.style.visibility = "visible";
};
So clearly, InfoBox is the problem.
If you are interested, loadMarkers() looks like this:
function loadMarkers() {
for ([...]) {
// ...
// some code that defines "position" and "name"
// ...
var marker = new google.maps.Marker({
position: position,
map: null,
title: name
});
var ibOptions = {
content: name,
boxStyle: {textAlign: "center", fontSize: "6pt", color:
"#000", width: "50px"},
disableAutoPan: true,
pixelOffset: new google.maps.Size(-25, -5),
position: position,
closeBoxURL: "",
isHidden: true,
pane: "mapPane",
enableEventPropagation: true
};
var ibLabel = new InfoBox(ibOptions);
ibLabel.open(map);
markersArray.push(marker);
infoBoxArray.push(ibLabel);
}
}
Very sorry for not having a link to provide, but I'm working on this
on a local computer and have no access to an external server. Hope you
guys can help me out anyway! Thanks in advance.
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
