Google Maps

HTML

<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;dummy=.js"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/src/infobubble.js"></script>
<div id="map_canvas" class="gmap border_box"></div>

CSS

.gmap {
    width:100%;
    height:250px;
    border: 1px solid #4D2722;
}
.border_box {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

JavaScript

function initialize() {
    var myLatlng = new google.maps.LatLng(51.507, -0.1275);
    var myOptions = {
      zoom: 10,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
      
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    
    var flightPlanCoordinates = [

        new google.maps.LatLng(51.507, -0.1275),
        new google.maps.LatLng(51.607, -0.1275),
        new google.maps.LatLng(51.607, -0.1675),
        new google.maps.LatLng(51.507, -0.1675),
        new google.maps.LatLng(51.507, -0.1275),

    ];
        
   var Symbol = {
      path:google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
      scale: 4,
      strokeColor: "green",
      strokeWeight: 2    
    }
        
      for (var i=0;i<4;i++){
        create_marker(i,flightPlanCoordinates,Symbol,map)
  }
  
  

    var flightPath = new google.maps.Polyline({
        path: flightPlanCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2
        
    });

    flightPath.setMap(map);
    
}

window.onload = function() {
    initialize();
}; 
        
        function create_marker(i,flightPlanCoordinates,Symbol,map){
            var marker = new google.maps.Marker({
                position: flightPlanCoordinates[i],
                icon: Symbol,
                map: map
             });

    

                // attachWindow(marker, i);  
            
            var infowindow = new google.maps.InfoWindow();
            infowindow.setContent("hello" + i);
            
            google.maps.event.addListener(marker, 'click', function() {
                infowindow.open(map,marker);
            });
        }