清除氣球谷歌地圖：未捕獲ReferenceError：標記未定義

Question

我創建了一個切換來清除我所有標記的地圖。當點擊切換調用getMapVisit（）

我得到這個錯誤，當我點擊切換：

Uncaught ReferenceError: markers is not defined 

就行了這段JavaScript代碼

由星下標明：

function load() { 
     var map = new google.maps.Map(document.getElementById("map"), { 

     zoom: 13, 
     mapTypeId: 'roadmap' 
     }); 
     var infoWindow = new google.maps.InfoWindow; 

     // Change this depending on the name of your PHP file 
     downloadUrl("getMapMarkers.php", function(data) { 
     var bounds = new google.maps.LatLngBounds(); 
     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 type = markers[i].getAttribute("type"); 
      var point = new google.maps.LatLng(
       parseFloat(markers[i].getAttribute("lat")), 
       parseFloat(markers[i].getAttribute("lng"))); 
      var html = "<b>" + name + "</b> <br/>" ; 
      var icon = customIcons[type] || {}; 
      var marker = new google.maps.Marker({ 
      map: map, 
      position: point, 
      icon: icon.icon, 
      shadow: icon.shadow 
      }); 
      bindInfoWindow(marker, map, infoWindow, html); 
      bounds.extend(point); 

     } 
     map.fitBounds(bounds); 
     }); 


    } 

    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 getMapVisit() 
    { 
     alert("in clear new clear al lmarkers"); 
     //clear markers 
     clearOverlays(); 
     markers = []; 

     return false; 
    } 

function clearOverlays() { 
     setAllMap(null); 
     } 

function setAllMap(map) { 
    for (var i = 0; i < markers.length; i++) { ************** 
     markers[i].setMap(map); 
    } 
} 

    function doNothing() {} 

我的PHP，其顯示地圖和肘節是：

$page->content .= '<p> <h3> Your Beer Map 
<form class="form-horizontal pull-right" style="width: 400px !important; padding-right: 20px !important;"> 
    <div class="control-group"> 
     <div class="controls btn disabled switch switch-two"> 
      <input id="week9" name="view" type="radio" checked> 
      <label for="week9" onclick="getMapDrank()">Drank Beer From</label> 

      <input id="month10" name="view" type="radio"> 
      <label for="month10" onclick="getMapVisit()">Visited</label> 

      <span class="slide-button btn btn-warning"></span> 
     </div> 
    </div> 
</form> 
</h3> 



</p>'; 




$page->content .= '<div id="map" style="width: 700px; height: 500px"></div>'; 

Answer 1

markers是downloadUrl()回調函數中的局部變量。看起來你希望它成爲一個全局變量。你可以嘗試加入這一行，在最高層，在任何函數之外：

var markers = []; 

，並從downloadUrl()回調內改變這一行：

var markers = xml.documentElement.getElementsByTagName("marker"); 

到：

markers = xml.documentElement.getElementsByTagName("marker"); 

那可能不是代碼中唯一的問題，但無論如何這都是一個問題。