Google api Markers windows open on load

Question

My code does all I want it to except you have to click on the markers to open the the window. How do I get the windows to open on load? I cant seem to figure out what I am doing wrong. I have info.window(map, marker) in my code. Am I not using it correctly?

   function initialize() {
        var mapOptions = {
            panControl: false,
            scrollwheel: false,
            scaleControl: true,
            zoomControl: true,
            zoomControlOptions: {
                position: google.maps.ControlPosition.LEFT_BOTTOM
            },
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DEFAULT,
                position: google.maps.ControlPosition.LEFT_CENTER
            }
        };
        var image = 'images/ventible-marker.png';
        var map = new google.maps.Map(document.getElementById('map-page'), mapOptions);
        var bounds = new google.maps.LatLngBounds();
        var infowindow = new google.maps.InfoWindow();
        for (var i in LocationData) {
            var p = LocationData[i];
            var latlng = new google.maps.LatLng(p[0], p[1]);
            bounds.extend(latlng);
            var marker = new google.maps.Marker({
                map:map,
                position: latlng,
                icon: image,
                animation: google.maps.Animation.DROP, cursor: "default"
            });
            var content = "<ul class='list-inline'>" + 
                            "<li>" + 
                                "<a href='event.php?page=" + p[2].replace(/\s/g, "-") + "'>" + 
                                    "<img src='" + p[4] + "'/>" +
                                "</a>" +
                            "</li>" +
                            "<li>" + 
                                "<a href='event.php?page=" + p[2].replace(/\s/g, "-") + "'>" + 
                                "<strong>" + p[2] + "</strong></a>" + 
                                "<br/>" + p[5] +
                                "<br/><a href=\"https://maps.google.com/maps?daddr=" + 
                                p[3] + "\" target=\"_blank\">Get Directions</a>" + 
                            "</li>" + 
                        "</ul>";
            google.maps.event.addListener(marker, 'click', (function(marker, content) {
                return function() {
                    infowindow.setContent(content);
                    infowindow.open(map, marker);
                }
            })(marker, content));
        }
        map.fitBounds(bounds);
    }
    google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

You have call

infowindow.open(map, marker);

only in event listener for marker click event. If you want to open infowindow on load you have to add the same code after content is created:

    var content = ...
    infowindow.setContent(content);
    infowindow.open(map, marker);

Changing only that you will get infowindow opened for last marker created only. So you have to move creation of infowindow to for loop:

var bounds = new google.maps.LatLngBounds();
//var infowindow = new google.maps.InfoWindow();

for (var i in LocationData) {
    var infowindow = new google.maps.InfoWindow();
    ...

See example at jsbin without images and without your content.