Individual radius for Google Maps Heatmap

2
votes

Im using the google maps javascript v3 api, and im trying to make a heatmap application using this api heatmap layer. In my application i need each location (weighted lanlng location) to have its own radius. As i seen in the documentation, the radius property is set for the entire layer (same radius for all the locations in the heatmap layer). Having multiple heatmap layers is not a good solution cause it slows down the application too much. Got any ideas?

Thanks, Sagi

1
javascriptgoogle-mapsgoogle-maps-api-3heatmap

1 Answers

0
votes

You could make multiple heatmap layers. https://github.com/pa7/heatmap.js/issues/96#issuecomment-272202758

var data1 = [
{location: new google.maps.LatLng(59.4072, 24.7053),weight:0.8},
{location: new google.maps.LatLng(59.4372, 24.7473),weight: 1},
{location: new google.maps.LatLng(59.4372, 24.7493),weight:0.8},
{location: new google.maps.LatLng(59.483428, 24.841709),weight: 0.6},
{location: new google.maps.LatLng(59.483256, 24.846666),weight: 0.2},
{location: new google.maps.LatLng(59.409425, 27.278345),weight: 0.3}

];

heatmap1 = new google.maps.visualization.HeatmapLayer1({ data: data1, radius: 10 });
var data2 = [
{location: new google.maps.LatLng(59.4072, 24.7053),weight:0.8},
{location: new google.maps.LatLng(59.4372, 24.7473),weight: 1},
{location: new google.maps.LatLng(59.4372, 24.7493),weight:0.8},
{location: new google.maps.LatLng(59.483428, 24.841709),weight: 0.6},
{location: new google.maps.LatLng(59.483256, 24.846666),weight: 0.2},
{location: new google.maps.LatLng(59.409425, 27.278345),weight: 0.3}

];

heatmap2 = new google.maps.visualization.HeatmapLayer2({ data: data2, radius: 3 });