Here is the code with arrays for multiple markers. See it in action at: http://cac.us.com/map/
This code currently works for me with using only one marker, and it has the marker's info balloon displayed by default, and it is toggle-able by clicking the marker. This var's point values: "i1.infoWindowAnchor = new GPoint(21, 80);" are for half the width of the marker icon, and all of its height. The same is true of the i1.iconAnchor values.
<script type="text/javascript">
<!--
//<![CDATA[
function createMarker(p, l, i) {
var marker = new GMarker(p, i);
// Show this marker's index in the info window when it is clicked
if (l != '') {
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(l);
});
}
return marker;
}
function reCenter(index) {
map.panTo(ps[index], map.getZoom());
mrs[index].openInfoWindowHtml(ls[index]);
}
function load() {
if (GBrowserIsCompatible()) {
var i1 = new GIcon();
i1.image = "http://cac.us.com/images/map/CAC-map-marker.png";
i1.iconSize = new GSize(43, 80);
i1.iconAnchor = new GPoint(20, 80);
i1.shadow = "http://cac.us.com/images/map/CAC-map-marker-shadow.png";
i1.shadowSize = new GSize(87, 80);
i1.infoWindowAnchor = new GPoint(21, 80);
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
//map.addControl(new GMapTypeControl()); // this adds the "map/satellite/hybrid" choice
map.setCenter(new GLatLng(39.2841, -80.3043), 12, G_NORMAL_MAP);
var marker = 0;
var mrs = new Array(1);
var ps = new Array(new GLatLng(39.3041347756603,-80.34428358078));
var ls = new Array('<p align="left"><font face="Tahoma, Arial, Helvetica" size="2"><nobr><b>Christian Apostolic Church (UPC)</b></nobr><br /><nobr>Rt. 3, Box 303C, Clarksburg, WV 26301</nobr><br /><img border="0" src="http://cac.us.com/images/map/CAC-bldg-for-map-marker.png" width="65" height="44" align="left" hspace="0" /><nobr>(On N. 20th St at Arlington.)</nobr><br /><nobr> <a href="http://cac.us.com">cac.us.com</a> • 304.624.4459</nobr><br /><nobr> <a href="mailto:pastor@cac.us.com">pastor@cac.us.com</a> • <a href="http://cac.us.com/map/">more</a></nobr></font><font style='font-size: 1pt'><br /> </font></p>');
var is = new Array(i1);
for (var i = 0; i < 1; i++) {
mrs[i] = createMarker(ps[i], ls[i], is[i]);
map.openInfoWindowHtml(ps[i], ls[i]);
map.addOverlay(mrs[i]);
}
}
}
//]]>
//-->
</script>
Sincerely,
Doug Joseph