Question

一直在尝试创建一个自定义谷歌地图，我已经编写了代码，但事情并不完全正确，想知道是否有人可以指出我做错了什么。代码在这里：

<script type="text/javascript">
  function initialize() {
    var myLatlng = new google.maps.LatLng(30,0);
    var myOptions = {
      zoom: 2,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.TERRAIN
  }

  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  var countries = Array();

  countries.push({
      marker: new google.maps.Marker({position: new google.maps.LatLng(4.52,115), map: map, title: 'Test'}),
      infowindow: new google.maps.InfoWindow({content: "Hello world"})
  });
  countries.push({
      marker: new google.maps.Marker({position: new google.maps.LatLng(42.45,23.20), map: map, title: 'Test2'}),
      infowindow: new google.maps.InfoWindow({content: "Hello world2"})
  });
  countries.push({
      marker: new google.maps.Marker({position: new google.maps.LatLng(12.15,-1.30), map: map, title: 'Test3'}),
      infowindow: new google.maps.InfoWindow({content: "Hello world3"})
  });

  for each (var item in countries) {
      google.maps.event.addListener(item.marker, 'click', function() {
        item.infowindow.open(map, item.marker);
      });

}

Answer 1

似乎工作正常，我看到一张带有3个标记的地图，但不知道问题是什么，这很难说。

一些猜测：

你在最后关闭初始化
你有一个id为“map_canvas”的div？
是否从任何地方调用初始化？
您是否已收录Google地图javascript？

Answer 2

除using the wrong style for loop之外，你正试图make a function in a loop。 这是一个非常常见的错误。由于JS具有功能级别的范围，而不是块级别，因此无法正常工作。

试试这个：

function makeCallback(country) {
    return function () {
        country.infowindow.open(map, country.marker);
    };
}

var item;
for (var i=0; i<countries.length; i++) {
    item = countries[i];
    google.maps.event.addListener(item.marker, 'click', makeCallback(item));
}

使用多个标记和弹出窗口创建自定义谷歌地图 - 问题

2 个答案: