Question

我试图将动态信息窗口设置为动态标记的onclick功能，但我似乎无法使其正常工作。

目前发生的情况是，当我点击其中一个标记时，它会在两个标记上显示相同的数据。我能理解这里的问题是我的变量＆＃34; i＆＃34;总是一样的，这就是为什么我总是做i-2，但我似乎无法理解为什么值总是变量的最后一个值而不是假定迭代中的当前值。

以下是处理标记和信息窗口的代码：

function doMarkers() {
    $.ajax({
        url: "/resources/scripts/php/conn/ajax/getEmployeeMap.php",
        type: "GET",
        dataType: 'json',
        cache: false,
        success: function (response) {
            clearMarkers();
            var data = response;
            var i = 1;
            while (i <= Object.keys(data).length) {
                geocoder.geocode({'address': data[i]}, function (results, status) {
                    if (status == 'OK') {
                        var geomarker = results[0].geometry.location;
                        var marker = new google.maps.Marker({
                            position: geomarker
                        });
                        marker.setMap(map);

                        var infoContent = '<p>Address: </p>' + data[i - 2];
                        console.log(data[i - 2]);

                        var infoWindow = new google.maps.InfoWindow({
                            content: infoContent
                        });

                        infoWindows.push(infoWindow);


                        marker.addListener('click', function () {
                            infoWindows[i -2].open(map, marker);
                        });

                        console.log(markers.length);
                        markers.push(marker);
                    }
                });
                i++;
            }
        }
    });
}

Answer 1

也许这样尝试：

function doMarkers() {
    $.ajax({
        url: "/resources/scripts/php/conn/ajax/getEmployeeMap.php",
        type: "GET",
        dataType: 'json',
        cache: false,
        success: function(response) {
            clearMarkers();
            var data = response;
            var i = 1;
            while (i <= Object.keys(data).length) {
                geocoder.geocode({
                    'address': data[i]
                }, function(results, status) {
                    if (status == 'OK') {
                        var geomarker = results[0].geometry.location;
                        var marker = new google.maps.Marker({
                            position: geomarker
                        });
                        marker.setMap(map);

                        var infoContent = '<p>Address: </p>' + data[i - 2];
                        console.log(data[i - 2]);

                        var infoWindow = new google.maps.InfoWindow({
                            content: infoContent
                        });

                        marker.addListener('click', function() {
                            infoWindow.open(map, marker); //directly add the event to the info window
                        });

                        infoWindows.push(infoWindow); //add it after adding your event

                        console.log(markers.length);
                        markers.push(marker);
                    }
                });
                i++;
            }
        }
    });
}

将动态infoWindow设置为动态标记的onclick函数

1 个答案: