I am trying to add the infowindow and tooltip to the marker in my google map. I have tooltip.js and recipient_country.js file.There are no errors in firebug,but but no content is display in the browser.It should display the map with marker and each marker having tooltip and infowindow.But it says ReferenceError: key is not defined in createInfoWindow(marker,key);
function createInfoWindow(marker,key){ //create an infowindow for this marker. var infowindow = new google.maps.InfoWindow({ content:recipient_country[key].Country_Name, maxwidth:250 }); //open infowindow on click event on marker. google.maps.event.addListener(marker,'click',function(){ if(lastOpenInfoWin) lastOpenInfoWin.close(); lastOpenInfoWin = infowindow; infowindow.open(marker.get('map'),marker); }); } // Here is where we create a tooltip for each marker, //with content set to recipient_country[placeindex].value function createTooltip(marker,key){ //create a tooltip var tooltipOptions = { marker:marker, content:recipient_country[key].Country_Name, cssClass:'tooltip' //name of a css class to apply to tooltip }; var tooltip = new Tooltip(tooltipOptions); } // used to keep trackk of the open Infowindow,so when // new one is about to be open, we close the old one. // Create map on DOM load // I'm using an array of recipient_country(recipient_counrty.js) to populate the markers function createMap(){ var geocoder = new google.maps.Geocoder(); var map = new google.maps.Map(document.getElementById('map_canvas'),{ center:new google.maps.LatLng(33.93911,67.709953), mapTypeId:google.maps.MapTypeId.ROADMAP, zoom:2, disableDefaultUI:true, zoomControl:true, zoomControlOptions: { style:google.maps.ZoomControlStyle.SMALL }, mapTypeControl:true, mapTypeControlOptions:{ style:google.maps.MapTypeControlStyle.DROPDOWN_MENU, position:google.maps.ControlPosition.TOP_CENTER } }); for(var j= 0; j < recipient_country.length; j++) { (function(i) { var building = recipient_country[i]; geocoder.geocode({'address':building.Country_Name}, function(results,status){ if(status == google.maps.GeocoderStatus.OK){ var marker = new MarkerWithLabel({ position:new google.maps.LatLng(results[0].geometry.location.lat(),results[0].geometry.location.lng()), title:building.Country_Name, map:map, labelContent:building.value, labelAnchor:new google.maps.Point(6,22), labelClass:"labels", labelInBackground:false, icon:"pics/circle2.png" }); createInfoWindow(marker,key); createTooltip(marker,key); } else{ console.log("Geocode was not succcessful for the following reason:" + status); } }); })(j);