Hi,
i am converting my V2 to V3 but the info windows doesn't seem to work. I have read up a bit and this is my
i have added a html to my marker array so it reads something like
var beaches = [
['Bondi Beach', -33.890542, 151.274856, 4, 'test'
],
['Coogee Beach', -33.923036, 151.259052, 5, 'test'
],
['Cronulla Beach', -34.028249, 151.157507, 3, 'test'
]
];
and this is the setMarkers function where i added the infowindow part
function setMarkers(map, locations) {
// Add markers to the map
// Marker sizes are expressed as a Size of X,Y
// where the origin of the image (0,0) is located
// in the top left of the image.
// Origins, anchor positions and coordinates of the marker
// increase in the X direction to the right and in
// the Y direction down.
var image = new google.maps.MarkerImage('
http://www.renjeroute.nl/hardloop-route/imgs/img_start.png',
// This marker is 20 pixels wide by 32 pixels tall.
new google.maps.Size(30, 30),
// The origin for this image is 0,0.
new google.maps.Point(0,0),
// The anchor for this image is the base of the flagpole at 0,32.
new google.maps.Point(0, 30));
var shadow = new google.maps.MarkerImage('
http://www.renjeroute.nl/hardloop-route/imgs/img_start.png',
// The shadow image is larger in the horizontal dimension
// while the position and offset are the same as for the main image.
new google.maps.Size(39, 30),
new google.maps.Point(0,0),
new google.maps.Point(0, 32));
// Shapes define the clickable region of the icon.
// The type defines an HTML <area> element 'poly' which
// traces out a polygon as a series of X,Y points. The final
// coordinate closes the poly by connecting to the first
// coordinate.
var shape = {
coord: [1, 1, 1, 20, 18, 20, 18 , 1],
type: 'poly'
};
for (var i = 0; i < locations.length; i++) {
var beach = locations[i];
var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
shadow: shadow,
icon: image,
shape: shape,
title: beach[0],
zIndex: beach[3],
html: beach[4]
});
/* now inside your initialise function */
infowindow = new google.maps.InfoWindow({
content: "holding..."
});
for (var i = 0; i < markers.length; i++) {
var marker = markers[i];
google.maps.event.addListener(marker, 'click', function () {
// where I have added .html to the marker object.
//infowindow.setContent(this.html);
alert(this.html);
infowindow.open(map, this);
});
}
/* end info window */
}
}
How can i fix this?