2016-09-24 150 views
0

我試圖在谷歌地圖上點擊標記以及填充lat和lng的輸入框。在放置新標記並更新lat和lng之前,我需要先清除所有現有標記。除了當我添加代碼嘗試清除所有標記時,所有東西都可以工作。谷歌地圖在放置新標記之前清除所有標記

以下代碼可以很好地工作,但在放置新標記之前不會清除舊標記。

謝謝。

工作的代碼,但不清除現有的標記......

<div id="map"></div> 
<script> 

var map; 


    function initMap() { 

    var latlng = new google.maps.LatLng(-29, 25); 
    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 6, 
    center: latlng, 
    }); 

      google.maps.event.addListener(map, 'click', function(event){ 
      var marker_position = event.latLng; 
      marker = new google.maps.Marker({ 
      map: map, 
      draggable: false 
     }); 
    marker.setPosition(marker_position); 
    document.getElementById("latFld").value = event.latLng.lat(); 
    document.getElementById("lngFld").value = event.latLng.lng(); 
})      
    } 
    </script> 

不工作代碼清除標記添加一個新的前...

<div id="map"></div> 
<script> 

var map; 
    var markersArray = []; 

    function initMap() { 

    var latlng = new google.maps.LatLng(-29, 25); 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 6, 
     center: latlng, 
    }); 
      markersArray.push(marker); 
    google.maps.event.addListener(marker,"click",function(event){}); 
      google.maps.event.addListener(map, 'click', function(event){ 
      var marker_position = event.latLng; 
    marker = new google.maps.Marker({ 
      map: map, 
      draggable: false 
     }); 
    clearOverlays(); 
    marker.setPosition(marker_position); 
    document.getElementById("latFld").value = event.latLng.lat(); 
    document.getElementById("lngFld").value = event.latLng.lng(); 
}) 

    } 

    function clearOverlays() { 
for (var i = 0; i < markersArray.length; i++) { 
markersArray[i].setMap(null); 
    } 
    } 

謝謝。

+0

看來,這可能是足以只是把'如果(標記)marker.setMap(空)''的標誌之前=新的google.maps.Marker({'在你的代碼的第一個版本中的行,即刪除標記,如果它已經存在,然後繼續創建新的標記... – ewcz

+0

謝謝你ewcz。 – user1432290

回答

3

似乎已放置的代碼在錯誤的地方..嘗試

<div id="map"></div> 
<script> 

var map; 
var markersArray = []; 

function initMap() { 

    var latlng = new google.maps.LatLng(-29, 25); 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 6, 
     center: latlng, 
    }); 

    clearOverlays(); 
    marker = new google.maps.Marker({ 
      map: map, 
      draggable: false 
    }); 

    google.maps.event.addListener(marker,"click",function(event){}); 
    google.maps.event.addListener(map, 'click', function(event){ 
    var marker_position = event.latLng; 
     marker.setPosition(marker_position); 
     markersArray.push(marker); 
     document.getElementById("latFld").value = event.latLng.lat(); 
     document.getElementById("lngFld").value = event.latLng.lng(); 
    }) 
} 

function clearOverlays() { 
for (var i = 0; i < markersArray.length; i++) { 
     markersArray[i].setMap(null); 
    } 
    markersArray = []; 
    } 
</script> 
+0

非常感謝你,讚賞。 – user1432290

+0

它也幫助了我。 –