如何更新infowindow的內容與循環setInterval

Question

我有問題每次更新infowindow內容我的循環運行指定的setInterval.Every 1秒的infowindow的內容將更改每個標記數組......但我我有問題如果我把關閉在if語句。 5分鐘後瀏覽器會因爲每隔1秒添加一個監聽器而崩潰。我想要的只是更新每個標記的內容，我會這麼做。

預先感謝您。

var map; 
var marker; 
var markerarray =[]; 

setInterval(function(){ 
    $.ajax({ 
    type: "post", 
    url: "vehiclecordinates.php", 
    success: function(data){ 
     coordinates = data.latlng; 
     vehiclename = data.vehiclename; 
     heading  = data.heading; 
     devname = data.vehiclename; 
     thedate = data.trackdate; 

     for (var i = 0; i < coordinates.length; i++) { 
     newcoordinate = new google.maps.LatLng(coordinates[i].split(",")[0],coordinates[i].split(",")[1]); 
     if (markerarray[vehiclename[i]] && markerarray[vehiclename[i]].setPosition){ 

      markerarray[vehiclename[i]].icon.rotation = parseInt(heading[i]); 
      markerarray[vehiclename[i]].setPosition(newcoordinate); 

      var con = '<div style="font: 11px arial,tahoma,helvetica,sans-serif;">Vehicle Name:' + devname + '<br/>' +'Date='+thedate+'</div>'; 

     }else { 
      marker = new MarkerWithLabel({ 
      map:map, 
      labelClass: "mylabels", 
      labelStyle: {opacity: 1.0}, 
      labelContent: '<div>'+ vehiclename[i]+'</div>', 
      icon:{ 
       path: google.maps.SymbolPath.CIRCLE, 
      scale:.7, 
      strokeColor: 'white', 
      strokeWeight: .10, 
      fillOpacity: 1, 
      fillColor: '#404040', 
      offset: '5%', 
      rotation: parseInt(heading[i]), 
      anchor: new google.maps.Point(10, 50) 
      } 
      }); 
      marker.setPosition(newcoordinate); 
      markerarray[vehiclename[i]] = marker; 
      var con = '<div style="font: 11px arial,tahoma,helvetica,sans-serif;">Vehicle Name:' + devname + '<br/>' +'Date='+thedate+'</div>'; 

     google.maps.event.addListener(marker, 'click', (function (marker, con, infowindow) { 
     return function() { 
      infowindow.setContent(con); 
      infowindow.open(map, marker); 
     }; 
     })(marker, con, infowindow)); 
     } 




     } 
    } 
    }); 
},1000); 

Answer 1

您需要爲您的anonymus clickEventListener函數命名。

1. 然後使用javacript code to remove click event。

2. 如果您使用jquery添加eventlistener，那麼您可以很容易地unbind()該函數，或搜索它是否存在，然後不添加。

3. 您可以設置一個bool：clickSet=true，您在調用eventlistener後設置。

編輯：

代碼：

function whatever(marker, con, infowindow) { 
     return function() { 
      infowindow.setContent(con); 
      infowindow.open(map, marker); 
     }; 
}; 
var map; 
var marker; 
var markerarray =[]; 

setInterval(function(){ 
    $.ajax({ 
    type: "post", 
    url: "vehiclecordinates.php", 
    success: function(data){ 
     coordinates = data.latlng; 
     vehiclename = data.vehiclename; 
     heading  = data.heading; 
     devname = data.vehiclename; 
     thedate = data.trackdate; 

     for (var i = 0; i < coordinates.length; i++) { 
     newcoordinate = new google.maps.LatLng(coordinates[i].split(",")[0],coordinates[i].split(",")[1]); 
     if (markerarray[vehiclename[i]] && markerarray[vehiclename[i]].setPosition){ 

      markerarray[vehiclename[i]].icon.rotation = parseInt(heading[i]); 
      markerarray[vehiclename[i]].setPosition(newcoordinate); 

      var con = '<div style="font: 11px arial,tahoma,helvetica,sans-serif;">Vehicle Name:' + devname + '<br/>' +'Date='+thedate+'</div>'; 

     }else { 
      marker = new MarkerWithLabel({ 
      map:map, 
      labelClass: "mylabels", 
      labelStyle: {opacity: 1.0}, 
      labelContent: '<div>'+ vehiclename[i]+'</div>', 
      icon:{ 
       path: google.maps.SymbolPath.CIRCLE, 
      scale:.7, 
      strokeColor: 'white', 
      strokeWeight: .10, 
      fillOpacity: 1, 
      fillColor: '#404040', 
      offset: '5%', 
      rotation: parseInt(heading[i]), 
      anchor: new google.maps.Point(10, 50) 
      } 
      }); 
      marker.setPosition(newcoordinate); 
      markerarray[vehiclename[i]] = marker; 
      var con = '<div style="font: 11px arial,tahoma,helvetica,sans-serif;">Vehicle Name:' + devname + '<br/>' +'Date='+thedate+'</div>'; 

     google.maps.event.addListener(marker, 'click', whatever); 
     } 




     } 
    } 
    }); 
},1000);