Google maps marker - infowindow

Question

I need to in InfoWindow show match.offer.text. Each marker has a different match.offer.text.

This is my code:

var markerImageURL, lat, lng;
if (myoffer) {
    markerImageURL = 'assets/img/markers/marker_my.png';
    lat = match.lat;
    lng = match.lng;
} else {
    markerImageURL = 'assets/img/markers/marker_' + match.strength + '.png';
    lat = match.offer.lat;
    lng = match.offer.lng;
}

var marker = new google.maps.Marker({
    position: new google.maps.LatLng(lat, lng),
    map: window.googleMap,
    icon: {
        size: new google.maps.Size(54,56),
        url: markerImageURL
    },
    draggable: false,
    visible: true
});

var infowindow = new google.maps.InfoWindow({
    content: match.offer.text,
    maxWidth: 300
});

window.googleMapMarkers.push(marker);

if(!myoffer) {
    window.MVC.Events.GoogleMap.prototype.showInfoWindow(marker, infowindow, match);
}

Event triggered after clicking on the marker:

marker.addListener('click', function() {
    infowindow.open(window.googleMap, marker);
}

Please, help me.

do you get any errors in your developer tools console? what does your code currently do? — Jaromanda X, Jan 10 '16 at 22:29
Please provide a [Minimal, Complete, Tested and Readable example](http://stackoverflow.com/help/mcve) that demonstrates your issue. — geocodezip, Jan 10 '16 at 22:32
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 10 '16 at 22:33
Jaromanda X: when I give a string to the content it displays me everywhere the same text `content: "text",` When content is "match.offer.text" in console I have: `Potentially unhandled rejection [1] window.MVC.Events.GoogleMap.prototype.addGoogleMapMarker@file:///D:/Zlecenia/...` — , Jan 10 '16 at 22:37

score 1 · Accepted Answer · answered Jan 10 '16 at 22:41

The content is applied to the marker on Open therefore your code will apply the content in last item in your loop to all markers, in your openWindow function add the content to a single infoWindow object i.e.

Also the Maps API has its own event wrapper for the click event

function initMarkers(){
   //create markers
   var marker = new google.maps.Marker();

   google.maps.event.addListener(marker, 'click', openInfoWindow(marker, i));
}

var infowindow = new google.maps.InfoWindow();
function openInfoWindow(marker,index){
         return function(e) {

            //Close other info window if one is open
            if (infowindow) {
                infowindow.close();
            }

            var content = marker.offer.text;

            infowindow.setContent(content);

            setTimeout(function() {
                infowindow.open(map, marker);
            }, 200);
        }
}

Google maps marker - infowindow

1 Answers1