0

I have already have an array of markers, I want to close an opened infowindow when I click another marker. I know that with the v3 API, I can close a infowindow with the InfoWindow.close() method.But where to add the code?I have tried a lot but failed. I have another question ,why need I click the link in "side_bar_div" tiwce to call the method myclick(i)?

<script type="text/javascript"> var markers=[]; var side_bar_html='<table border=0 cellpadding=0><tr>'; var tdrow = 1; var i = 0; function creatmarker(lat,long,map,html,index){ var mylatlng = new google.maps.LatLng(lat,long); var marker = new google.maps.Marker({ position: mylatlng, map: map, zIndex: index }); var infowindow = new google.maps.InfoWindow({ content: html }); markers.push(marker); side_bar_html +='<td width=330 valign=top align=left><a id="side_bar_'+i+'" href="javascript:myclick('+ (markers.length-1) +');">'+html+'</a></td>'; tdrow++; i++; if (tdrow > 2){side_bar_html += '</tr><tr>'; tdrow =1; } google.maps.event.addListener(marker,'click',function(){ infowindow.open(map,marker); }); function myclick(i){ var id="side_bar_"+i; google.maps.event.addDomListener(document.getElementById(id), "click", function(){ google.maps.event.trigger(markers[i], "click"); }); } function initialize(){ var myOptions = { zoom: 11, center: new google.maps.LatLng(-33.9, 151.2), mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("mymap"),myOptions); var lat = "-33.890542"; var lng = "151.274856"; var html = 'Bondi Beach'; creatmarker(lat,lng,map,html,5); var lat = "-33.923036"; var lng = "151.259052"; var html = 'Coogee Beach'; creatmarker(lat,lng,map,html,4); var lat = "-34.028249"; var lng = "151.157507"; var html = 'Cronulla Beach'; creatmarker(lat,lng,map,html,3); var lat = "-33.80010128657071"; var lng = "151.28747820854187"; var html = 'Manly Beach'; creatmarker(lat,lng,map,html,2); var lat = "-33.950198"; var lng = "151.259302"; var html = 'Maroubra Beach'; creatmarker(lat,lng,map,html,1); side_bar_html +='</tr></table>'; document.getElementById("side_bar_div").innerHTML = side_bar_html; } google.maps.event.addDomListener(window, 'load', initialize); </script> 

2 Answers 2

1

Try the following code snippet:

 var infoWindows = []; google.maps.event.addListener(marker,'click',function(){ closeInfowindow(); var infowindow = new google.maps.InfoWindow({ content: html }); infowindow.open(map,marker); infoWindows[0] = infowindow; }); function closeInfowindow(){ if(infoWindows.length > 0){ infoWindows[0].set("marker",null); infoWindows[0].close(); infoWindows.length = 0; } } 

Hope this helps you :-)

Sign up to request clarification or add additional context in comments.

4 Comments

This does not work,too,and I even cannot open any infowindow.
got it.. In your code one spelling mistake was there correct it its working fine.Instead of this infowWindows[0].close(); paste infoWindows[0].close();
you are a life saver mate. I have another question ,why need I click the link in "side_bar_div" tiwce to call the method myclick(i)?
In myclick(i) function just use the following code: function myclick(i){ var id="side_bar_"+i; google.maps.event.trigger(markers[i], "click"); }
0

The correct way to do this is to store it in a local variable and then add an eventlistener like this:

function addeventlistenerinfo(marker, infowindow, i){ google.maps.event.addListener(marker, 'click', function() { if (currentinfowindow) currentinfowindow.close(); infowindow.open(map,marker); currentinfowindow = infowindow; }); markersarray[i] = marker; } 

currentinfowindow is a global variable that will only hold the open infowindow if one exists.

No need to use an array or an extra method :)

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.