I have problem with infoBubble in google maps api v3. I load markers from db and add infoBubbles for that markers. But work just infoBubble from last added marker. Can u see the problem please?
var gmarkers = [];
var map;
function load() {
var defaultLocation = new google.maps.LatLng(49.8248188, 15.4684482);
var map = new google.maps.Map(document.getElementById("map"), {
center: defaultLocation,
zoom: 8,
mapTypeId: 'roadmap'
});
downloadUrl("generatexml.php", function (data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var id = markers[i].getAttribute("id");
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
});
var infoBubble = new InfoBubble({
content: '<div' + name + '</div',
boxClass: 'info-box',
alignBottom: true,
pixelOffset: new google.maps.Size(-150, -40),
maxWidth: 300,
disableAutoPan: false,
hideCloseButton: false,
});
google.maps.event.addListener(marker, 'click', function () {
infoBubble.open(map, marker);
console.log(infoBubble.content);
});
gmarkers.push(marker);
}
});
}
I found it, just replace:
google.maps.event.addListener(marker, 'click', function () {
infoBubble.open(map, marker); console.log(infoBubble.content); });
with:
google.maps.event.addListener(marker, 'click', function () {
infoBubble.setContent(this.content); infoBubble.open(map, this); });
Thank you for help.