Maps API v3 Infowindows with multiple markers

http://stackoverflow.com/questions/24803074

by hmahida

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script>
<div id="map"></div>

CSS

html, body, #map {
     height: 100%;
     width: 100%;
     margin: 0px;
     padding: 0px;
 }

JavaScript

var markers = [];

    function initialize() {
    
        var locations = 
  [{"lat": 43.644128, 
"lng": -79.614072},
{"lat": 43.645324, 
"lng": -79.612732},
{"lat": 43.644983,
"lng": -79.614356},
{"lat": 43.646147,
"lng": -79.612586},
{"lat": 43.645047,
"lng": -79.611943},
{"lat": 43.643356,
"lng": -79.613061},
{"lat": 43.645436,
"lng": -79.610665},
{"lat": 43.646193,
"lng": -79.610018}]

    
        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 5,
            center: new google.maps.LatLng(43.88,-79.28),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });
    
        var infowindow = new google.maps.InfoWindow();
    
        for (var i = 0; i < locations.length; i++) {
    
            var newMarker = new google.maps.Marker({
                position: new google.maps.LatLng(locations[i].lat, locations[i].lng),
                map: map,
               
            });
    
           
    
            markers.push(newMarker);
        }
    }
    
    initialize();