從谷歌地圖中刪除標記

對不起，如果這是一個非常簡單的，而且我是愚蠢的，但我已經得到了一些代碼，並且我從MYSQL中提取數據並將標記放置在地圖中。我有標記位置發生變化，所以我想更新標記位置而無需重新加載頁面。所有工作，但我不能得到以前的標記刪除之前放置新的標記。從谷歌地圖中刪除標記

正如你可以在我的代碼中看到的，我試圖甚至放置一個按鈕（不是我需要的，但只是爲了看看我能否得到它的工作）來清除標記，那甚至不工作。

任何幫助，將不勝感激:)

這裏是我的代碼：

<!DOCTYPE html > 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>vRAF Link 16 Map</title> 
     <style> 
     /* Always set the map height explicitly to define the size of the div 
     * element that contains the map. */ 
     #map { 
     height: 100%; 
     } 
     /* Optional: Makes the sample page fill the window. */ 
     html, body { 
     height: 100%; 
     margin: 0; 
     padding: 0; 
     } 

     #floating-panel { 
     position: absolute; 
     top: 10px; 
     left: 25%; 
     z-index: 5; 
     background-color: #fff; 
     padding: 5px; 
     border: 1px solid #999; 
     text-align: center; 
     font-family: 'Roboto','sans-serif'; 
     line-height: 30px; 
     padding-left: 10px; 
     } 

    </style> 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 
     //<![CDATA[ 
     var markers = []; 
     setInterval(function() { 
      DeleteMarkers(); 
      Link16_2(); 
     }, 5000); 

     function DeleteMarkers() { 
      //Loop through all the markers and remove 
      for (var i = 0; i < markers.length; i++) { 
       markers[i].setMap(null); 
      } 


      markers = []; 
     }; 

     var customIcons = { 
      bar: { 
       icon: 'http://map.vraf.net/icon.png' 
      } 

     }; 

     var map = null; 
     var infoWindow = null; 
     function load() { 
      map = new google.maps.Map(document.getElementById("map"), { 
      center: new google.maps.LatLng(54.559322, -4.174804), 
      zoom: 6, 
      mapTypeId: 'satellite' 
      }); 


      infoWindow = new google.maps.InfoWindow; 

      // Change this depending on the name of your PHP file 
      Link16_2(); 
     } 

     function Link16_2() {  
       // Change this depending on the name of your PHP file 
       downloadUrl("genxml_link16.php", function(data) { 
       var xml = data.responseXML; 
       var markers = xml.documentElement.getElementsByTagName("marker"); 

       for (var i = 0; i < markers.length; i++) { 

        var name = markers[i].getAttribute("name"); 
        var callsign = markers[i].getAttribute("callsign"); 
        var symbol = markers[i].getAttribute("symbol"); 

        var point = new google.maps.LatLng(
         parseFloat(markers[i].getAttribute("lat")), 
         parseFloat(markers[i].getAttribute("lon"))); 

        var html = "<b>" + callsign + "</b> <br/>" + name; 
        var icon = customIcons[symbol] || {}; 
        var marker = new google.maps.Marker({ 
        map: map, 
        position: point, 
        icon: icon.icon 
        }); 

        markers.push(marker); 


        bindInfoWindow(marker, map, infoWindow, html); 
       } 
       }); 
      } 

     function bindInfoWindow(marker, map, infoWindow, html) { 
      google.maps.event.addListener(marker, 'click', function() { 
      infoWindow.setContent(html); 
      infoWindow.open(map, marker); 
      }); 
     } 

     function downloadUrl(url, callback) { 
      var request = window.ActiveXObject ? 
       new ActiveXObject('Microsoft.XMLHTTP') : 
       new XMLHttpRequest; 

      request.onreadystatechange = function() { 
       if (request.readyState == 4) { 
        request.onreadystatechange = doNothing; 
        callback(request, request.status); 
       } 
      }; 

      request.open('GET', url, true); 
      request.send(null);  
     } 

     function doNothing() { } 


     // 




     //HOT KEYS 

     // 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 = []; 
     } 

     // Deletes all markers in the array by removing references to them 
     function deleteOverlays() { 
     if (markers) { 
     for (i in markers) { 
     markers[i].setMap(null); 
     } 
     markers.length = 0; 
     } 
} 

</script> 

    </head> 

    <body onload="load()">  

    <div id="floating-panel"> 
     <input onclick="clearMarkers();" type=button value="Hide Markers"> 
     <input onclick="showMarkers();" type=button value="Show All Markers"> 
     <input onclick="deleteOverlays();" type=button value="Delete Markers"> 
    </div> 
    <div id="map"> 

    </div> 
    </body> 

</html>

來源

2017-02-24 Scott Daniels

你有兩個數組稱爲markers，一個XML元素的數組是本地downloadUrl功能和您可能希望成爲google.maps.Marker對象的全局數組。給他們不同的名字。

var gmarkers = [];

內downloadUrl：

gmarkers.push(marker);

而且DeleteMarkers：

function DeleteMarkers() { 
    //Loop through all the markers and remove 
    for (var i = 0; i < gmarkers.length; i++) { 
    gmarkers[i].setMap(null); 
    } 
    gmarkers = []; 
};

proof of concept fiddle

來源

2017-02-25 00:15:16 geocodezip

我已經改變了他們的比特和地圖沒有更新，在現在都：S –

謝謝了它現在工作:) –

從谷歌地圖中刪除標記

回答

相關問題