user2438546 user2438546 - 6 months ago 46
Javascript Question

Toggle between data in Google Heat Map

Just wondering if there is a easy way to toggle between 2 or more sets of data array variables using the heat map layer with Google Maps?

The classic example of:

var taxiData = [
new google.maps.LatLng(37.782551, -122.445368),
new google.maps.LatLng(37.782745, -122.444586), ...
];

pointArray = new google.maps.MVCArray(taxiData);
heatmap = new google.maps.visualization.HeatmapLayer({
data: pointArray
});
heatmap.setMap(map);


But what if I want to have a vartaxiDataJan, vartaxiDataFeb and toggle between the 2? I want to create a toggle button, and then switch between the data sets, in this case, between 2 months.

I looked at the following: Updating heatmap data, simple google HeatMap

But that only adds a new record to the bottom of the array, whereas I want to replace the complete array

Thanks in advance!

Answer

Seems you can only have one HeatMapLayer object at a time. This works for me:

function toggleHeatmap() {
  if (firstData) {
    heatmap.setData(pointArray2);
    firstData=false;
  } else {
    heatmap.setData(pointArray);
    firstData=true;
  }
}

working example

Comments