Friday, July 26, 2013

Google maps Information Window










This is how to add a simple information window to your google maps.
First you have to implement the google map... Here is the google documentation for how to load google maps. https://developers.google.com/maps/documentation/javascript/tutorial... here is the small code snippet which i have used to make an information window for a particular location on google maps.


var infowindow = new google.maps.InfoWindow
({
  content:chHtml,
  maxWidth:200,
maxHeight:200

 });
chHtml=var chHtml ="<h6>Follow us: </h6><h3><a href='<?php echo $link?>'"
+" target='_blank'> <?php echo $name?> </a></h3><div> "

+" <input name=\"add\" class='the_button' type=\"button\" value=\"add\" lat=\"<?php echo $email?>\"  lat=\"<?php echo $lat?>\" long=\"<?php echo $long ?>\" onclick=\"addNew(<?php echo $lat?>, <?php echo $long ?>, '<?php echo $email ?>');\"/> "
+"</div><div> <?php echo $type?>  </br>  </div>"; here chHtml means the content of your information window.  maxWidth maxHeight refers to width and height respectively.

then as the last step in the initialize() function you have to populate the information window.

infowindow.open(map, marker);

No comments:

Post a Comment