Google maps and marker on map

Question

I need to show markers on a map and show for each marker a popup with some infos. Here my code:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var createMap = function() {
        var address = document.getElementById("address").value;
        var geocoder = new google.maps.Geocoder();
        geocoder.geocode( {'address': address}, function(results,status){
            if (status == google.maps.GeocoderStatus.OK) {
                var options = {
                    zoom: 12,
                    center: results[0].geometry.location,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById('map'), options);
                setMarkers(map, sites);
            } 
            else {
                alert("Problema nella ricerca dell'indirizzo: " + status);
            }
        });
    }

    //Aggiungo i marker alla mappa
    function setMarkers(map, markers) {
        for (var i = 0; i < markers.length; i++) {
            var sites = markers[i];
            var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
            var marker = new google.maps.Marker({
                position: siteLatLng,
                map: map,
                title: sites[0],
                zIndex: sites[3],
                html: "<b>"+sites[0]+"</b><br>"+sites[4]
            });

            google.maps.event.addListener(marker, "click", function () {               
                infowindow.setContent(this.html);
                infowindow.open(map, this);
            });
        }
    }

    //Elenco dei marcatori da aggiungere
    var sites = [[ 'Veterinari Associati', 45.448405,9.19823 , 1 , 'Via Palladio 4 - 20100 Milano (MI)'],];


    window.onload = createMap;
</script>
<input id="address" type="hidden" value="Milan">
<div id="map" style="width:345px; height:306px;"></div>

Everything works as expected, the marker is placed but when I click on the market the popup doen't shows up. I cannot understand where is the problem...

possible duplicate of [Google Maps JS API v3 - Simple Multiple Marker Example](http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) — geocodezip, Jan 22 '14 at 17:46

score 2 · Accepted Answer · edited Jan 22 '14 at 17:57

2

You dint intialise infowindow, try this

google.maps.event.addListener(marker, "click", function () {  
  var infowindow = new google.maps.InfoWindow();
  infowindow.setContent(this.html);
  infowindow.open(map, this);
});

edited Jan 22 '14 at 17:57

Andy

61,948
13
68
95

answered Jan 22 '14 at 17:43

Ramesh Kotha

8,266
17
66
90

score 1 · Answer 2 · answered Jan 22 '14 at 17:42

1

It's because you haven't set up an infowindow prior to setting its HTML and opening it. Insert this:

var infowindow = new google.maps.InfoWindow();

answered Jan 22 '14 at 17:42

Andy

61,948
13
68
95

Google maps and marker on map

2 Answers2