How to link a button to a google map marker? - google-maps

Question

I'm trying to create my own map using google map.
I want to create a list showing all existing markers on the map. When user clicks on one button/link from the list, the corresponding marker will be centered and its infoWindow will be displayed, i.e. the same effects as the user clicks on the marker.
I have tried a number of solutions, but I could get none of them working. Can anyone please offer me a simple solution for this? Thanks in advance!
My existing code is as follows,
google.maps.event.addDomListener(window, 'load', function() {
var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(19.642588,151.171875),
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false
});
var infoWindow = new google.maps.InfoWindow;
var onMarkerClick1 = function() {
var marker = this;
infoWindow.setContent('content of infowindow');
infoWindow.open(map, marker);
};
var marker1 = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(19.642588,151.171875),
});
google.maps.event.addListener(marker1, 'click', onMarkerClick1);

Answer 1

this won't center the map on it, but will move so the whole balloon is visible
http://econym.org.uk/gmap/example_map2.htm
as simple as i can get it. yes, please use GMarker etc.
don't forget this in the header <script src="http://maps.google.com/maps?...
you'll need html that includes
<div id="map" style="width: 550px; height: 450px"></div>
<div id="side_bar">Marker One<br /></div>
and then javascript
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(19.642588, 151.171875), 8);
var point = new GLatLng(19.642588, 151.171875);
var marker = new GMarker(point);
GEvent.addListener(marker, "click", function () {
marker.openInfoWindowHtml("this marker has been clicked");
});
function myclick(i) {
GEvent.trigger(marker, "click");
}
map.addOverlay(marker);