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); 
     } 
    ); 
}