Friday 29 June 2012

Multiple markers in google map version 3


Click to add markers to the map





<html>

 <head>
   <title>Multiple Markers</title>

   <script type="text/javascript" 
     src="http://maps.googleapis.com/maps/api/js?
     key=YOUR-API-KEY&sensor=false">
   </script>

   <script type="text/javascript">
  
     var map;          

     function initialize()
     {

      var latlng = new google.maps.LatLng(24.20689,81.386719);

      var myOptions = {
      zoom: 2, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.TERRAIN
      };

      map = new google.maps.Map
            (document.getElementById("map_canvas"), myOptions);
              
      google.maps.event.addListener(map, 'click',
       function(event)
       {
        addMarker(event.latLng);
       });
 
     }
    
     function addMarker(location) 
     {
      marker = new google.maps.Marker({
      position: location,
      map: map });
     }          

   </script>
 </head>

 <body onload="initialize()">    
    <div>
        <div id="map_canvas" style="width:450; height:450">
  </div>
    </div>  
 </body>

</html>

No comments:

Post a Comment