2017-04-18 80 views
1

與我的代碼,每次你點擊地圖時出現幾個標記。如何刪除谷歌地圖api標記後設置

我想只是一個單一的標記,每次點擊刪除上一個標記,並設置新的標記的緯度/ lng到新位置。

這裏是我的代碼:

var map; 
    var markers = []; 

    function initMap() { 
     var aa = {lat: 32.3896651, lng: 48.3791718}; 

    map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 12, 
     center: aa 
    }); 

    // This event listener will call addMarker() when the map is clicked. 
    map.addListener('click', function(event) { 
     addMarker(event.latLng); 
     document.getElementById("la").value = event.latLng.lat(); 
document.getElementById("lo").value = event.latLng.lng(); 
    }); 



    } 

    // Adds a marker to the map and push to the array. 
    function addMarker(location) { 
    var marker = new google.maps.Marker({ 
     position: location, 
    flat: false, 
    map: map, 
    draggable: true 
    }); 
    markers.push(marker); 
    } 

    // Sets the map on all markers in the array. 
    function setMapOnAll(map) { 
    for (var i = 0; i < markers.length; i++) { 
     markers[i].setMap(map); 
    } 
    } 

    // Removes the markers from the map, but keeps them in the array. 
    function clearMarkers() { 
    setMapOnAll(null); 
    } 

    // Shows any markers currently in the array. 
    function showMarkers() { 
    setMapOnAll(map); 
    } 

    // Deletes all markers in the array by removing references to them. 
    function deleteMarkers() { 
    clearMarkers(); 
    markers = []; 
    } 
+1

看到這個http://stackoverflow.com/questions/20101805/how-to-remove-a-single-marker-from- google-map –

+0

[Google Maps API v3:如何刪除所有標記?]的可能重複(http://stackoverflow.com/questions/1544739/google-maps-api-v3-how-to-remove-all-markers ) – 2017-04-18 05:49:31

回答

1

通過增加每一次新的標誌物,要創建在你的網頁許多對象。 爲什麼不重新使用現有的標記?做標記全球而不是標記陣列,

var marker = null; 

,然後使用現有的標記對象的setPosition兩種改變位置:

marker.setPosition(location); 

通過這種方式,您只使用一個標記,只是在不同的位置。

var map; 
var marker = null; 

function initMap() { 
    var aa = {lat: 32.3896651, lng: 48.3791718}; 

    map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 12, 
     center: aa 
    }); 

// This event listener will call addMarker() when the map is clicked. 
    map.addListener('click', function(event) { 
     addMarker(event.latLng); 
     document.getElementById("la").value = event.latLng.lat(); 
     document.getElementById("lo").value = event.latLng.lng(); 
    }); 

    } 

// Adds a marker to the map and push to the array. 
function addMarker(location) { 
     if(marker) 
      marker.setPosition(location); 
     else 
      marker = new google.maps.Marker({ 
       position: location, 
       flat: false, 
       map: map, 
       draggable: true 
     }); 

    } 

// Sets the map on all markers in the array. 
function setMapOnAll(map) { 

     marker.setMap(map); 

    } 

    // Removes the markers from the map, but keeps them in the array. 
    function clearMarkers() { 
    marker.setMap(null); 
    } 

    // Shows any markers currently in the array. 
    function showMarkers() { 
    marker.setMap(map); 
    } 

    // Deletes all markers in the array by removing references to them. 
    function deleteMarkers() { 
    clearMarkers(); 
    } 
+0

哦,非常感謝,但請更多地解釋 –

+0

哦,它是固定的,感謝一位洛神保佑你 –

+0

如果它幫助你,請把它作爲答案。 – dev8080