Creating custom HTML info windows for markers in using the Google Maps API

Question

I'm creating an array of information to populate markers using the Google Maps API.

How can I use the following script to add html to the markers?

The array while be built in a php loop.

var markers = [];
var title = [];

var point = new GLatLng(51.505804230524056,-0.11801719665527344);
marker = new GMarker(point);
map.addOverlay(marker);
markers[0] = marker;
title[0] = "marker 0";

var point = new GLatLng(51.45400691005981,-0.263671875);
marker = new GMarker(point);
map.addOverlay(marker);
markers[1] = marker;
title[1] = "marker 1";

Answer 1

If you are using v2.0 of the API? If so, I'd strongly recommend creating an RSS/XML/KML feed from your site and then using the GGeoXml class to create an overlay from that feed.

If you are using v3.0 of the API, then the GGeoXml class is not available, however, a the geoxml3 library has been developed to allow for just KML files.

That being said, if you want to directly add the markers in v2.0, you would call the bindInfoWindow, bindInfoWindowHtml, bindInfoWindowTabs or bindWindowInfoTabsHtml methods on the GMarker instances you are creating in order to set the HTML displayed when the marker is clicked.

In v3.0 of the API, you would create an instance of the InfoWindow class and then call the open method, passing the optional anchor parameter, which represents the MVCObject instance (which in this case is your Marker instance).