2012-07-24 78 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爲引用標記,在其上添加你的聽衆: