2012-07-24 88 views
0

我在我的谷歌地图中实现了多个可拖动标记。现在我的问题是我的坐标似乎没有更新,除了最后一个。多个可拖动标记不更新

我没有得到任何错误,但只有标记10更新位置和地址。

var map = new google.maps.Map(document.getElementById('mapCanvas'), { 
    zoom: 10, 
    center: new google.maps.LatLng(51.012904492831055, 4.3322019042968805), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

for(var i=0;i<10;i++) 
{ 
     var latLng = new google.maps.LatLng(51.012904492831055, 4.3322019042968805); 
     var marker = new google.maps.Marker({ 
      position: latLng, 
      title: 'Point ' + (i+1), 
      map: map, 
      draggable: true 
     }); 

     google.maps.event.addListener(marker, 'dragstart', function() { 
      updateMarkerAddress('Dragging...'); 
     }); 

     google.maps.event.addListener(marker, 'drag', function() { 
      updateMarkerStatus('Dragging...'); 
      updateMarkerPosition(marker.getPosition()); 
     }); 

     google.maps.event.addListener(marker, 'dragend', function() { 
      updateMarkerStatus('Drag ended'); 
      geocodePosition(marker.getPosition()); 
     }); 
} 

// Update current position info. 
updateMarkerPosition(latLng); 
geocodePosition(latLng); 

回答

2

它的变量范围问题,var marker是循环内部的一个全局变量,并且通过循环更新,因此最后一个值在循环结束时被设置。

只是包装你的每一个google.maps.event.addListener在函数内部,即

(function(marker){ // Inside this function 'marker' is a local variable. 
    google.maps.event.addListener(marker, 'dragstart', function() { 
     updateMarkerAddress('Dragging...'); 
    }); 

    google.maps.event.addListener(marker, 'drag', function() { 
     updateMarkerStatus('Dragging...'); 
     updateMarkerPosition(marker.getPosition()); 
    }); 

    google.maps.event.addListener(marker, 'dragend', function() { 
     updateMarkerStatus('Drag ended'); 
     geocodePosition(marker.getPosition()); 
    }); 
})(marker); // Pass the 'global' marker variable as an argument 
2

当您的活动dragstartdragdragend被触发,变量与您所创建的最后Marker,因为到那个时候你的循环已经结束。

尝试讲座敬爱的办法来避免这种情况:

​​

或者您可以使用this为引用标记,在其上添加你的听众: