-1

好的，所以过去几天我一直在研究这个问题，但似乎仍然无法让它工作:(

我有一组属性，如下所示：

var map_markers = [
    ['London Road, Amesbury, SP4 7ER <br/> 2nd Line', 'London Road, Amesbury,', 1],
    ['Countess Court, Amesbury, SP4 7ER <br/> 2nd Line', 'Countess Court, Amesbury,', 2],
    ['Windsor Road, Salisbury, SP2 7NF <br/> 2nd Line', 'Windsor Road, Salisbury,', 3],
    ['Bishopdown Road, Salisbury, SP1 3DT <br/> 2nd Line', 'Bishopdown Road, Salisbury,', 4],
    ['Gainsborough Close, Salisbury, SP2 9HD <br/> 2nd Line', 'Gainsborough Close, Salisbury,', 5],
];

现在，我想要的是在用户单击标记时弹出一个信息窗口。我可以让标记代码正常工作，但我在将信息绑定到标记时遇到问题，无论我在哪里或如何设置内容，它似乎只能获取最后一个元素。这是我目前的代码减去代码点击监听器，因为这是我需要帮助的。

我想在我的信息窗口中显示的内容是每个属性的数组中的第一个元素：

function init_map(map_id, center_address, markers) {

    geocoder = new google.maps.Geocoder();

    geocoder.geocode( { 'address': center_address, 'region': 'uk' }, function(results, status) {

    if (status == google.maps.GeocoderStatus.OK) { 

         //Init Map Options
         var mapOptions = {
            zoom: 11,
            center: results[0].geometry.location,
            mapTypeId: google.maps.MapTypeId.ROADMAP
         }

         var map = new google.maps.Map(document.getElementById(map_id), mapOptions);

         setMarkers(map, markers);
         infowindow = new google.maps.InfoWindow({content: "loading..."});

      } else {

        alert("Unable to find address: " + status);

      }

  });

}

function setMarkers(map, markers) {

        for (var i = 0; i < markers.length; i++) {
            var locations = markers[i];
            var address = markers[i][1];

            geocoder.geocode( { 'address': address , 'region': 'uk' }, function(results, status) { 

             if (status == google.maps.GeocoderStatus.OK) { 

                marker = new google.maps.Marker({
                    position: new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng()),
                    map: map,
                    title: address
                });

                } else {
                    alert("There was a issue getting the property information.")
                }       
        });
      }
   }

我知道那里有很多教程，但这些似乎都不适用于我的代码，这段代码是因为标记是在地理编码函数中分配的？？？这是必需的，因为我的数据不包含 Lng/Lat 值。

请注意，我是一个完整的 JS 菜鸟，所以示例编码将不胜感激 :)

提前致谢...

4

1 回答 1

0

它适用于数组中的最后一个元素这一事实向我表明，您可能正在引用未在循环内声明的变量，或者您正在将循环计数器变量传递给另一个函数。

在您的地理编码回调函数中，您使用没有声明的变量标记var，这将导致marker创建一个名为的全局变量，回调的所有后续执行都将覆盖该变量。完成地理编码后，marker将引用最后添加的标记。

我也可能会在创建标记的同时绑定标记的单击，例如：

function setMarkers(map, markers) {
    for (var i = 0; i < markers.length; i++) {
        var locations = markers[i];
        var address = markers[i][1];
        // store the infowindow content for this marker
        var infocontent=locations[0];
        geocoder.geocode( { 'address': address , 'region': 'uk' }, function(results, status) { 
            if (status == google.maps.GeocoderStatus.OK) { 
                // use var to stop our marker getting overwritten
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng()),
                    map: map,
                    title: address
                });
                // bind to the click event of the marker
                google.maps.event.addListener(marker, 'click', function() {
                    var infwin=new google.maps.InfoWindow({content: infocontent});
                    infwin.open(marker);
                });

            } else {
                alert("There was a issue getting the property information.")
            }       
        });
    }
}
于 2013-04-22T01:00:27.767 回答