Maps API v3 Infowindows with multiple markers

http://stackoverflow.com/questions/24803074

by prateekbansal07

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 beaches = [
        ['43650 GARFIELD RD, 48038, MI', 37.43329608340594, -122.17508068941243, 1, 'Termination'],
        ['400 HOBART ST, 49601, MI', 37.787308199636044, -122.42300170391103, 1, 'Add'],
['1105 6th St, 49684, MI',37.758824040808676, -122.42090576550991,1, 'Add'],
        ['917 MAIN ST, 49635, MI', 37.78615906059124, -122.42075159733587, 1, 'Good']

    ];
    
        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 10,
            center: new google.maps.LatLng(37.43329608340594, -122.17508068941243),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });
    
        var infowindow = new google.maps.InfoWindow();
    
        for (var i = 0; i < beaches.length; i++) {
      var icon = "";
        if (beaches[i][4] == "Good") {
            icon = "http://maps.google.com/mapfiles/ms/icons/green-dot.png1"
        } else if (beaches[i][4] == "Manual") {
            icon = "http://maps.google.com/mapfiles/ms/icons/blue-dot.png1"
        } else if (beaches[i][4] == "Add") {
            icon = "http://maps.google.com/mapfiles/ms/icons/yellow-dot.png1"
        } else {
            icon = "http://maps.google.com/mapfiles/ms/icons/red-dot.png1"
        }
            var newMarker = new google.maps.Marker({
                position: new google.maps.LatLng(beaches[i][1], beaches[i][2]),
                icon:icon,
                map: map,
                title: beaches[i][0]
            });
    
            google.maps.event.addListener(newMarker, 'click', (function (newMarker, i) {
                return function () {
                    infowindow.setContent(beaches[i][0]);
                    infowindow.open(map, newMarker);
                }
            })(newMarker, i));
    
            markers.push(newMarker);
        }
    }
    
    initialize();