【问题标题】:GMaps APIv3 InfoWindow for markers in loop for() is always the same循环 for() 中标记的 Maps API v3 InfoWindow 始终相同
【发布时间】:2013-07-20 08:40:35
【问题描述】:

我知道这个话题已经讨论过很多次了,但我无法解决我的问题。 我想在我的地图上显示一些标记,每个标记都有一个点击事件。每个点击事件都应该打开一个包含一些数据的信息窗口。

这是我写的;此代码在控制台中运行没有任何错误,所有标记都正确显示,但单击时显示的信息窗口对所有人来说总是相同的......

//Global variable
var info = new google.maps.InfoWindow();

//... some other functions

function createMarker(map)
{
    for(i = 0 ; i < loadedMarkers.length ; i++) { 
        (function(i) {
            value = loadedMarkers[i];
            var pos = new google.maps.LatLng(value.Latitude, value.Longitude);

            var mapOptions = {
                zoom: 10,
                center: pos,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }

            var marker = new google.maps.Marker({
                position: pos,
                map: map,
                title: value.Title
            });

            var MarkerContent = "<div class=\"marker\">" +
                                    "<h2>"+ value.Title +"</h2>" +
                                    "<p>"+ value.Text +"</p>" +
                                "</div>";

            info.setOptions({
                content: MarkerContent,
                size: new google.maps.Size(50, 50),
                position: pos
            });

            google.maps.event.addListener(marker, 'click', function () {
                info.open(map, marker);
            }); 
         }
       )(i);
    }
}

我听说了一些闭包问题(我是 JS 新手),所以我尝试将逻辑放在 (function(i) ...) 中,但它总是为所有信息窗口显示相同的内容。

谁能解释我哪里错了(为什么?)

非常感谢

【问题讨论】:

    标签: google-maps google-maps-api-3 for-loop google-maps-markers infowindow


    【解决方案1】:

    信息窗口打开时需要更新内容(否则显示最后的内容):

        google.maps.event.addListener(marker, 'click', function () {
            info.setOptions({
                content: MarkerContent
            });
            info.open(map, marker);
        }); 
    

    【讨论】:

    • 完美运行,非常感谢!!但是我还是不明白为什么,在我之前的代码中,信息窗口的内容没有在每一轮循环中更新......
    • 是的(MarkerContent 已更新并设置为唯一信息窗口的内容)。但是最后一个值集在点击侦听器中使用,因为您没有使用点击侦听器运行时单击的标记特定的值来更新它。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-03-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-06-21
    • 1970-01-01
    相关资源
    最近更新 更多