Placing multiple markers on a Google Map with image

Example for Placing multiple markers with image on a Google Map

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=xxxxx" type="text/javascript"></script>
 <style type="text/css">
#map{
  height: 150%;
  width: 100%;
    }
 </style>

<script type="text/javascript">
    var map;
    var geocoder;
    var xml;
    var markers;
    var mapopt;
    var address;
    var    markeraddress;
    var k=0;
   
     // On page load, call this function
   function load()
   {
     // Create new map object
      map = new GMap2(document.getElementById("map")); 
      map.addControl(new GMapTypeControl());
      map.setMapType(G_SATELLITE_MAP);
      map.addControl(new GLargeMapControl3D());
      // Create new geocoding object
      geocoder = new GClientGeocoder();
      var latlonarr=new Array();
      var arselected = new Array(); 
      var length1=0;
      var loopcount=0;
      var sw=0;
     
        arselected[0]="Bhoopalpally Phase -II,Hanamkonda,Warangal";
        arselected[1]="Gopalan arcade.4th flore,1st Main,Kasturi Nagar,Bangalore,KA";
        arselected[2]="Sri Mobiles,No 2,24th Main,JP Nagar 1st Phase,Bangalore,KA";
        arselected[3]="#33,RK  Mutt Road,Ulsoor,Bangalore 560008,KA";
        arselected[4]="Minnu Tour & Travels No 74,Nagavarapalya,CV Raman Nagar,Bangalore,KA";
        arselected[5]="Fazal Technologies,No 89,Fazal Manor,Richmond Road,Bangalore,KA";
        arselected[6]="Neon Electronics,No 335/,Gokul Complex,Sampige Road,Malleshwaram,Bangalore,KA";
        arselected[7]="Canadian International School Survey No.420,Yelahanka,Bangalore,KA";
        arselected[8]="485,6th 'D' Cross,Koramangala 6th Block,Bangalore,KA";
        arselected[9]="Salarpuria Infinity, 3rd Floor #5,Bannerghatta Road ,Bangalore-560029,KA";
        arselected[10]="BMTC,central offices,K.H.Road,Shanthi nagar,Bangalore-560027";
        arselected[11]="57-A, 21st K M, Hosur Road, Bommasandra Industrial Area,Bangalore,KA";
        arselected[12]="63/8.Maruthi Layout,Near Rajaram Factory,2nd Phase,Peenya Industrial Area,Bangalore,KA";
        arselected[13]="Plot 1&2, KIADB Industrial area, Attibele,Bangalore,KA";
        arselected[14]="Apt 203, Scion Enclave, Govindappa Lane, Off 80 ft rd,Indira nagar,Bangalore,KA";
        
          var address=new Array();
        var exact_address=new Array();
          var exact=new Array();
        var j;
        var count=0;
        var marker=new Array();
        var exact_add=new Array();
        var xmlfl="<markers>";
        var s=0;
        var km=0;
        var url="'http://www.google.com','google','width=400,height=400'";
         for (var i = 0; i < arselected.length; i++)
          {
            address[i]= arselected[i];
            var len=address[i].split(',').length;
            exact=address[i].split(',');
            for(var k=0;k<3;k++)
            {
               exact_add[k]=exact[parseInt(len)-(parseInt(k)+1)];
            }
           
            exact_add.reverse();
            exact_address[i]=exact_add;
            s=i+1;
                xmlfl+="<marker address=\""+exact_address[i]+"\">";
                xmlfl+="<AlphaCharacter>"+s+"</AlphaCharacter></marker>";
              }
            xmlfl+="</markers>";
            document.getElementById("sample").innerHTML="";
            document.getElementById("sample").innerHTML=xmlfl;
            markers =document.getElementById("sample").getElementsByTagName("marker");
            for (var i = 0; i < exact_address.length; i++)
            { 
                    markeraddress = markers[i].getAttribute("address");
                  geocoder.getLocations(markeraddress,addToMap);
                 document.getElementById("loop").value=i;           
            }
               
         function addToMap(response)
                       {
                            
                              place = response.Placemark[0];
                             point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
                             latlonarr[km]=point;
                             km++;
                            sendpoint(point);                                     
                   }
                function sendpoint(point)
                {
                             var numberedIcon = new GIcon(G_DEFAULT_ICON)
                            var ar=address[loopcount];
                            map.setCenter(point, 13);
                             numberedIcon.image = "http://www.geocodezip.com/mapIcons/marker.png"
                            var k=document.getElementById("loop").value;
                             markerOptions = { icon:numberedIcon, clickable:true,title:ar,position:loopcount}
                             mapopt= { icon:numberedIcon, clickable:true,title:ar,position:loopcount};
                             marker= new GMarker(point,mapopt);
                            map.addOverlay(marker);
                            loopcount++;   
                }
                GEvent.addListener(map,"click",function(marker,markerOptions,ar)
                                           { 
                                                   var html="";
                                                   var ra="";
                                                   var sowji=0;
                                                for(var siri=0;siri<15;siri++)
                                                {
                                                   if(latlonarr[siri]==ar)
                                                   {
                                                      sowji=siri;
                                                      ra=address[siri-1];
                                                    } 
                                                }
                                               
                                                 html=ra+"<br><img src=\"im/css.jpg\"  height=\"160px\" width=\"240px\"/>For More Information <a href=javascript:popupwin("+url+")><b>click<b></a>";
                                                marker.openInfoWindowHtml(html,{maxWidth:200},markerOptions);
                                            });
              }
             
    function popupwin(url)
    {
        newwindow=window.open(url);
        if (window.focus) {newwindow.focus();}
    }
  </script>
  </head>
 <body onLoad="load()">
<input type="hidden" name="loop" id="loop">
<div id="map"></div>
<div id="sample" style="display=none"></div>
</body>
</html>