谷歌地图信息窗口未从变量加载内容

Google map Infowindow not loading content from var

本文关键字：变量 加载 信息 信息窗 窗口 谷歌地图      更新时间：2023-09-26

我需要帮助让信息窗口显示来自位置的值[i][0]

位置[

i][1]对于地址值工作得很好，但我希望能够从var"位置"为信息窗口中的每个标记设置自定义标题。

我可以定义一个 var 来设置内容和信息窗口的工作方式，但每个标记都是一样的，而不是从 var"位置"中提取

任何帮助不胜感激！

function initialize() {

geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 10,
center: new google.maps.LatLng(0, 0),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(
document.getElementById("map_canvas"),
myOptions);
setMarkers(map, locations);
}
var locations = [
['Bondi Beach', '798 9th Ave, New York, NY', 4],
['Coogee Beach', '42 E 29th St, New York, NY', 5],
['Cronulla Beach', '56 W 25th St, New York, NY', 3],
];

function setMarkers(map, locations) {
var infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
 var marker, i; 
for (var i=0; i<=locations.length; i++) { 

   geocoder.geocode({'address': locations[i][1]}, function(results, status) { 
    marker = new google.maps.Marker({
    position: results[0].geometry.location,
    map: map,

    });

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.open(map, marker);
      infowindow.setContent(locations[i][0]);
    }
  })(marker, i));
bounds.extend(marker.getPosition());

map.fitBounds(bounds);
})
  }
}

正在发生的事情是点击事件侦听器正在获取i = 3（循环结束后 i 的最后一个值），因此由于这种未定义的状态，没有出现 InfoWindow。

由于引入了地理编码器，因此外部for循环在单击侦听器获得分配给它们的函数之前完成。因此，需要另一个位于地理编码之外的函数范围包装器，以在侦听器中保留正确的 i 值。

function setMarkers(map, locations) {
  var infowindow = new google.maps.InfoWindow();
  var bounds = new google.maps.LatLngBounds();
  var marker, i; 
  //CHANGED REMOVED EQUALS SIGN
  for (var i=0; i<locations.length; i++) { 
   //ADDED
   (function(i) {
   geocoder.geocode({'address': locations[i][1]}, function(results, status) { 
     marker = new google.maps.Marker({
       position: results[0].geometry.location,
      //REMOVED COMMA
       map: map
     });
     google.maps.event.addListener(marker, 'click', (function(marker, i) {
       return function() {
         //CHANGED ORDER
         infowindow.setContent(locations[i][0]);
         infowindow.open(map, marker);
       }
     })(marker, i));
     bounds.extend(marker.getPosition());
     map.fitBounds(bounds);
     });
    // ADDED
    })(i);
   }
 }
相关文章：