動態更新MarkerwithLabel Google Maps API V3

我是Google Maps API的新手。我有一個調用事件處理程序的HTML頁面，然後使用XML返回數據來標記標記和標籤。問題是我似乎無法刷新標籤值。標籤剛剛超過自己寫，遲早IE會崩潰，並說「停止運行此腳本？在此頁上的腳本導致您的web瀏覽器運行緩慢......」動態更新MarkerwithLabel Google Maps API V3

<!--<script type="text/javascript" src="/js/labeledmarker.js"></script>--> 

<script type="text/javascript"> 

var map; 
     function initialize() { 
     var mapDiv = document.getElementById('map-canvas'); 
     map = new google.maps.Map(mapDiv, { 
      center: new google.maps.LatLng(27.896415, -81.843137), 
      zoom: 9, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 

     google.maps.event.addListenerOnce(map, 'tilesloaded', addMarkers); 

     } 

     function addMarkers() 
{ 

    downloadUrl("get_waittime_feed.ashx", function (data) { 

     var markers = data.documentElement.getElementsByTagName("marker"); 
     for (var i = 0; i < markers.length; i++) { 
      var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("latitude")), 
            parseFloat(markers[i].getAttribute("longitude"))); 
      var markericons = markers[i].getAttribute("markericons"); 
      var waitER = markers[i].getAttribute("waitER"); 

      var customIcons = { 0: { icon: new google.maps.MarkerImage('../img/greenbb.png', new google.maps.Size(30, 30)) }, 
       1: { icon: new google.maps.MarkerImage('../img/redbb.png', new google.maps.Size(30, 30)) }, 
       2: { icon: new google.maps.MarkerImage('../img/hospital.png', new google.maps.Size(35, 35))} 
      }; 
      var icon = {}; if (markericons == '0') { 
       icon = customIcons[0]; 
      } 
      else if (markericons == '1') { 
       icon = customIcons[1]; 
      } 
      else if (markericons == '2') { 
       icon = customIcons[2]; 
      }; 

      var marker = new MarkerWithLabel({ 
       position: latlng, 
       map: map, 
       icon: icon.icon, 
       labelContent: waitER, 
       labelAnchor: new google.maps.Point(3, 30), 
       labelClass: "labels", // the CSS class for the label 
       labelInBackground: false 
       }); 

     } 
    }); 

}; 

setInterval(addMarkers, 5000);

來源

2013-03-29 user2225553

的原因IE是張貼的警告是，你沒有真正更新標記 - 你每次調用addMarkers()時間創建一組新的標記。因此，地圖刷新需要的時間越來越長，直到超過IE的JavaScript時限。

不是每次都創建具有var marker = new MarkerWithLabel()一個新的，創建它們第一次你的函數被調用，然後在以後每次調用更新。例如：

totalmarkers = markers.length; 
for (i = 0; i < totalmarkers; i++) { 
    if (markers[i] == null) { // Create your marker here 
     markers[i] = new MarkerWithLabel({ 
      position: latlng, 
      map: map, 
      icon: icon.icon, 
      labelContent: waitER, 
      labelAnchor: new google.maps.Point(3, 30), 
      labelClass: "labels", // the CSS class for the label 
      labelInBackground: false 
      }); 
    } else { // Update your marker here 
     markers[i].labelContent = 'label content'; 
     markers[i].labelClass = 'label class'; 
     markers[i].label.setStyles(); // Force label to redraw (makes update visible) 
     markers[i].setPosition(googlemapslatlng); // Move the marker to a new position 
     markers[i].icon = iconurl; // If you want to change the icon 
     markers[i].setShape(); // Force the marker icon to redraw 
    }

希望有所幫助。也可以看看this thread更新標記標籤。

來源

2013-04-22 01:34:17 TheMeddlingMonk

markers[i].label.setStyles(); // Force label to redraw (makes update visible)

不要爲我工作，但

markers[i].label.draw(); // redraw the label for me

來源

2013-05-15 22:08:02 Swen

這爲我工作

marker.labelContent = 'New Label';

marker.label.setContent();

來源

2014-06-02 15:17:41

動態更新MarkerwithLabel Google Maps API V3

回答

相關問題