Google Map API Почему одинковый контент в infowindow?

Question

[Cheizer]

Друзья, всю голову сломал, подскажите пожалуйста, почему в infowindow одинаковый контент???

Инициализирую Google карту так, там два маркера со своими адресами. В конце цикл с добавлением маркеров и их infowindow, маркеры размещаются правильно, а вот информация "Адрес 1" и "Адрес 2" неправильно, по обоим маркерам по клику показывает "Адрес 1", что не так сделал? Куда копать?

function initialize() {  
              var myLatLng = {lat: 55.7319, lng: 37.6145};
		var myMapOptions = {
                    center: myLatLng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    zoom: 11,
                    scrollwheel: false,
                    mapTypeControl: false,
                    zoomControl: true,
					//draggable: draggable,
					styles: [{"stylers": [{ "saturation": -100 }]}],
				};
                var map = new google.maps.Map(document.getElementById("map"), myMapOptions);
              var locations = [
					{
						position: {lat: 55.6709, lng: 37.7475},
						icon: {
							url: "/images/pinMap.png",
							scaledSize: new google.maps.Size(69, 69)
						},
                        popupContent: '<p class="contentmap">Адрес 1</p>',
					},
					{
						position: {lat: 55.7015, lng: 37.8497},
						icon: {
							url:"/images/pinMap.png",
							scaledSize: new google.maps.Size(69, 69)
						},
                        popupContent: '<p class="contentmap">Адрес 2</p>',
					}];
    
    	      locations.forEach( function( element, index ){

					var marker = new google.maps.Marker({
						position: element.position,
						map: map,
						icon: element.icon,
					});
                  
       infowindow = new google.maps.InfoWindow({
            content: element.popupContent
        });        
       marker.addListener('click', function () {
          infowindow.open(map, marker);
       });       
});	
      }

Есть подозрение что я не праильно вызываю marker.addListener но это не факт :(

Answer 1

[Formula_1]

Поменял foreach на for и объявил переменные через let:

for (let i = 0; i < locations.length; i++) {
	let marker = new google.maps.Marker({
		position: locations[i].position,
		map: map,
	});

	let infowindow = new google.maps.InfoWindow({
		content: locations[i].popupContent
	});

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

Comments

[Cheizer]

БЛАГОДАРЮ! Так меняется адрес :) порядок.

[ProjectSoft]

Роман Кузнецов, let или var - разницы не будет.
infoWindow у вас в функции не объявлен, как переменная. Поэтому js решил, что он глобальный.
Если бы вы писали javascriot в строгом режиме, то вы бы словили явные ошибки.

function initialize() {
	"use strict"; 
	var myLatLng = {lat: 55.7319, lng: 37.6145},
		myMapOptions = {
			center: myLatLng,
			mapTypeId: google.maps.MapTypeId.ROADMAP,
			zoom: 11,
			scrollwheel: false,
			mapTypeControl: false,
			zoomControl: true,
			//draggable: draggable,
			styles: [{"stylers": [{ "saturation": -100 }]}],
		},
		map = new google.maps.Map(document.getElementById("map"), myMapOptions),
		locations = [
			{
				position: {lat: 55.6709, lng: 37.7475},
				icon: {
					url: "/images/pinMap.png",
					scaledSize: new google.maps.Size(69, 69)
				},
				popupContent: '<p class="contentmap">Адрес 1</p>',
			},
			{
				position: {lat: 55.7015, lng: 37.8497},
				icon: {
					url:"/images/pinMap.png",
					scaledSize: new google.maps.Size(69, 69)
				},
				popupContent: '<p class="contentmap">Адрес 2</p>',
			}
		];
    
	locations.forEach( function( element, index ){
		var marker = new google.maps.Marker({
				position: element.position,
				map: map,
				icon: element.icon,
			}),
			infowindow = new google.maps.InfoWindow({
				content: element.popupContent
			});        
		marker.addListener('click', function () {
			infowindow.open(map, marker);
		});       
	});	
}

[Cheizer]

ProjectSoft, то есть нужно так было писать?

var  infowindow = new google.maps.InfoWindow({
        content: element.popupContent
      });

[Cheizer]

ProjectSoft, точно! Так тоже работают, очень большое спасибо!!