Ошибка API для просмотра Google API

Question

Я пытаюсь добавить к каждому из маркеров, которые я нанес на карту Google, когда вы нажмете маркер, он покажет вам карту улиц.

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

    var panoramaOptions = { 
     position: mapPoints[i], 
     pov: { 
      heading: 34, 
      pitch: 10 
     } 
    }; 

    google.maps.event.addListener(marker, 'click', 
     function(){ 
      var panorama = new google.maps.StreetViewPanorama(document.getElementById("map_canvas"), panoramaOptions); 
      map.setStreetView(panorama); 
     } 
    ); 
} 

Однако все маркеры при нажатии отображают только вид на улицу последнего маркера.

Answer 1

Проблема в том, что вы создаете свои маркеры в цикле. Однако, когда вы нажимаете маркер, он создает StreetViewPanorama, используя то, что panoramaOptions находится во время клика, а не на основе того, что было в то время, когда вы перебирали маркеры, определяющие прослушиватели событий. Поэтому он всегда будет равен его последнему установленному значению.

Попробуйте вместо этого:

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

    var panoramaOptions = { 
     position: mapPoints[i], 
     pov: { 
      heading: 34, 
      pitch: 10 
     } 
    }; 

    defineEventListener(marker, panoramaOptions); 
} 

function defineEventListener(marker, panoramaOptions) { 
    google.maps.event.addListener(marker, 'click', 
     function(){ 
      var panorama = new google.maps.StreetViewPanorama(document.getElementById("map_canvas"), panoramaOptions); 
      map.setStreetView(panorama); 
     } 
    ); 
}