谷歌地图的JavaScript问题

Question

我试图创建一个应用程序，在用户点击的地图上创建一个标记。然后，如果用户点击标记，则应显示地址。

试图做到这一点我遇到了一个问题，到目前为止还没有找到解决方案。当我第一次点击地图时，第一个标记被创建。然后，当我尝试点击该标记时，不会显示任何内容。然后在第二次点击时出现第二个标记，如果我点击第二个标记，第二个标记应该显示的地址出现在第二个标记上，依此类推。所以标记地址不知怎么流离失所，无法弄清楚问题所在。

我一直在寻找一个问题，但不能确定是什么原因导致这种奇怪的行为。我是JavaScript的新手，所以我不知道它是否与异步请求有关，或者我忽略了代码中的错误。

的代码如下：

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"> 

</script> 
<script type="text/javascript"> 
    var map; 
    var counter; 
    var latlng; 
    var locationAddress; 
    var geocoder; 
    function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    latlng = new google.maps.LatLng(46.043830, 14.488864); 
    var myOptions = { 
     zoom: 16, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    counter = 0; 

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

    function placeMarker(location) { 
    var clickedLocation = new google.maps.LatLng(location); 
    latlng = location; 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
    }); 

    addLocationInfo(marker); 
} 

function addLocationInfo(marker){ 
    var infoWindow = new google.maps.InfoWindow({content: locationAddress, size: new google.maps.Size(50, 50)}); 
    google.maps.event.addListener(marker, 'click', function(){ 
     infoWindow.open(map, marker); 
    }); 
} 

function codeLatLng(latlng) { 
    if (geocoder) { 
     geocoder.geocode({'latLng': latlng}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      if (results[1]) { 
      locationAddress = results[1].formatted_address; 
      } 
     } else { 
      locationAddress = "Neznan naslov"; 
     } 
     }); 
    } 
    } 


</script> 

，我会很感激，如果有人能指出什么是问题的原因或提出任何更好的解决方案。

谢谢！

Answer 1

的问题是，地理编码器是异步的，所以locationAddress让你添加了infowindow与和不确定的内容后，它的价值..

的addLocationInfo将不得不从地理编码的回调函数中调用..
以下是在调用的函数级的一些细微的变化（一ND一些参数给他们）的代码来做到这一点..

var map; 
    var counter; 
    var latlng; 
    var locationAddress; 
    var geocoder; 
    function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    latlng = new google.maps.LatLng(46.043830, 14.488864); 
    var myOptions = { 
     zoom: 16, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    counter = 0; 

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

    }); 
    } 

    function placeMarker(location) { 
    var clickedLocation = new google.maps.LatLng(location); 
    latlng = location; 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
    }); 
    codeLatLng(location, marker); 
} 

function addLocationInfo(marker){ 
    var infoWindow = new google.maps.InfoWindow({content: locationAddress, size: new google.maps.Size(50, 50)}); 
    google.maps.event.addListener(marker, 'click', function(){ 
     infoWindow.open(map, marker); 
    }); 
} 

function codeLatLng(latlng, marker) { 
    if (geocoder) { 
     geocoder.geocode({'latLng': latlng}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      if (results[1]) { 
      locationAddress = results[1].formatted_address; 
      } 
     } else { 
      locationAddress = "Neznan naslov"; 
     } 
     addLocationInfo(marker); 
     }); 
    } 
    }