Google 地图信息窗口显示以前的地理结果而不是当前结果

Question

有人可以帮我解决这个问题吗？我不知道我的代码出了什么问题，我想在信息窗口中显示位置地址，但每次它都显示以前的结果而不是当前的结果。例如，当我第一次单击某个位置时，它会添加一个标记，但显示的地址未定义（这是之前的结果）。然后我单击另一个位置，它显示第一个位置的地址。

我该如何解决这个问题以显示当前标记位置的地址？请。多谢。下面是我的代码..

var map;
var marker;
var markersArray = [];

var infoWindow;
var buffer;

var geocoder, regeocoder;

function initialize() {

window.onunload = google.maps.Unload; 

// Creating an option object for the map

    var myOptions = {
            zoom: 16,
            center:COUNTRY,
            mapTypeId: google.maps.MapTypeId.ROADMAP
    };

// Initializing the map 

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

// Add onClick event to the map 

    google.maps.event.addListener(map, 'click', function(event) { placeMarker(event.latLng, true); });
}

function placeMarker(location, flag) {

// Get clicked location <Latitude, Longtitude>

var clickedLocation = location;

    if (markersArray) {
        for (i in markersArray) {
                markersArray[i].setMap(null);
        }
        markersArray.length = 0;
    }

    // Create a new marker 

    marker = new google.maps.Marker({
        position: clickedLocation, 
            map: map, 
            icon: 'image/blue-dot.png',
            title: "Select this location",
            clickable: true
    });

    if (flag == true) { 

        // Start reverse Geocode

        regeocoder = new google.maps.Geocoder();

        if (regeocoder) {
                regeocoder.geocode({'latLng': clickedLocation, 'region': region}, function(results, status){

                if (status == google.maps.GeocoderStatus.OK) {
                if (results[0]) { buffer = results[0].formatted_address; }
                } 
            else {  }
                });
        }

    setHiddenValue(buffer);

    setMarkerInfo(buffer, clickedLocation);

    }   

    // Attach mouseover event to a marker that will trigger the markerInfo  

    google.maps.event.addListener(marker, 'mouseover', function() { infowindow.open(map,marker); }); 

    // Attach mouseout event to the marker that will delete the markerInfo  

    google.maps.event.addListener(marker, 'mouseout', function() { if (infowindow) infowindow.close(); });  

    markersArray.push(marker);

    map.setCenter(clickedLocation);
}


function setMarkerInfo(title, textbody) {

    // Initialize the contentString

    var contentString = '<div id="content">'+'<div id="siteNotice">'+'</div>'+
    '<br/><h3 id="firstHeading" class="firstHeading">' + title + '</h1>'+
    '<div id="bodyContent">'+
    '<p>Map Coordinates: <br/>' + textbody + '</p>'+
    '</div>'+
    '</div>';

    infowindow = new google.maps.InfoWindow({ content: contentString });
    infosArray.push(infowindow);
}

function setHiddenValue(data) {
    var hiddenVal = document.getElementById('getLoc');
    if (hiddenVal) { hiddenVal.value = data; }
}

function searchMap(info) {

var address = info;
var loc;
var addr;

    geocoder = new google.maps.Geocoder();

    if (geocoder) {
            geocoder.geocode({'address': address, 'region': region}, function(sresults, sstatus){
                if (sstatus == google.maps.GeocoderStatus.OK) {

                    if (sresults[0]) { 

                    loc = sresults[0].geometry.location;

                    geocoder.geocode({'latLng': loc}, function(results, status){
                            if (status == google.maps.GeocoderStatus.OK) {
                            if (results[0]) { addr = results[0].formatted_address; }
                            } 
                        else { alert("No Matching Results"); }
                        }); 

                }

            }else { alert("No Matching Results"); }

            });
    }

    if (geocoder) {
            geocoder.geocode({'address': address, 'region': region}, function(sresults, sstatus){
                if (sstatus == google.maps.GeocoderStatus.OK) {

                    if (sresults[0]) { 

                    loc = sresults[0].geometry.location;

                    geocoder.geocode({'latLng': loc}, function(results, status){
                            if (status == google.maps.GeocoderStatus.OK) {
                            if (results[0]) { addr = results[0].formatted_address; }
                            } 
                        else { alert("No Matching Results"); }
                        }); 

                }

            }else { alert("No Matching Results"); }

            });
    }

    setHiddenValue(addr);

    setMarkerInfo(addr, loc);

    placeMarker(loc, false);

}

Answer 1

您的问题与地址信息异步到达这一事实有关，因此您在获得相对格式化地址之前执行所有代码：

geocoder.geocode({'latLng': loc}, function(results, status){
                            if (status == google.maps.GeocoderStatus.OK) {
                              if (results[0]) { addr = results[0].formatted_address; }
                            } 
                            else { alert("No Matching Results"); }
                 });

我建议将所有内容链接到组合函数调用中：

google.maps.event.addListener(marker, 'mouseover', function() { 

而不是：

infowindow.open(map,marker); });

您调用：

new google.maps.InfoWindow({ content:

并且而不是:

contentString });

你打电话：

geocoder.geocode({'latLng': loc}, function(结果, 状态){
    如果（状态== google.maps.GeocoderStatus.OK）{
         if (结果[0]) { addr = 结果[0].formatted_address; }
    } 别的 {
         *alert("没有匹配到的结果"); */
    }
});

并在此处将格式化结果转换为您想要的 css 形式，并将其作为字符串返回。

这样，每当您经过标记时，您都会查询相对地址并动态创建信息窗口。

希望有帮助。