Динамическая загрузка данных Heatmap на основе границ карты, проблема производительности

Question

Я внедрил простую страницу, использующую прослушиватель, чтобы определить, когда границы карт Google изменились из-за масштабирования или панорамирования. Я динамически загружаю json-данные для взвешенной тепловой карты, суммируемой областью, видимой на карте. Он работает все, за исключением того факта, что я неправильно очищаю предыдущие данные от тепловой карты при каждом вызове слушателю. Производительность начинает ухудшаться после 4-го или 5-го вызова для получения новых данных. Я пробовал устанавливать тепловую карту на нуль. Что еще необходимо для поддержания производительности?

var map, heatmap; 
    var heatMapData = []; 

    function initMap() { 

     var uluru = { lat: 32.673363, lng: -97.399290 }; 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 14, 
      center: uluru 

     }); 

     google.maps.event.addListener(map, "bounds_changed", function() { 
      heatmap = null; 
      var bounds = map.getBounds(); 
      //TODO: implement async request 
      var Httpreq = new XMLHttpRequest(); // a new request 
      var boxRequest = 'HeatMapData?lmin=' + bounds.f.f + '&lmax=' + bounds.f.b + '&lnmin=' + bounds.b.b + '&lnmax=' + bounds.b.f; 
      Httpreq.open("GET", boxRequest, false); 
      Httpreq.setRequestHeader("Content-type", "application/json") 
      var heatMapJSON = Httpreq.responseText; 

      heatMapData = []; 
      var parsedJSON = JSON.parse(heatMapJSON); 
      for (var i = 0; i < parsedJSON.length; i++) { 
       heatMapData.push({ location: new google.maps.LatLng(parsedJSON[i].Lat, parsedJSON[i].Lon), weight: parsedJSON[i].weight }) 
      }; 
      console.info('map points: ' + parsedJSON.length.toString()); 

      heatmap = new google.maps.visualization.HeatmapLayer({ 
       data: heatMapData, 
       map : map 
      }); 

     }); 

Answer 1

if (heatmap != null) { 
    heatmap.setMap(null); 
};