Google Maps – How to Apply Weight to Google Heatmap

google mapsheat mapjavascriptjson

I am trying to plot a Google heatmap based on the JSON objects returned. Here is my JavaScript:

function getHeatMap() {
 heatLayer = new HeatmapLayer({
config: {
    "useLocalMaximum": true,
    "radius": 40,
    "gradient": {
        0.45: "rgb(000,000,255)",
        0.55: "rgb(000,255,255)",
        0.65: "rgb(000,255,000)",
        0.95: "rgb(255,255,000)",
        1.00: "rgb(255,000,000)"
    }
},
"map": map,
"domNodeId": "heatLayer",
"opacity": 0.85
});

$.ajax({
url: "index.aspx/getBusCommuter",
type: "POST",
data: "",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
    var parsed = JSON.parse(data.d);
    $.each(parsed, function (i, jsondata) {
        var coordXicon = jsondata.BusStopX;
        var coordYicon = jsondata.BusStopY;
        var commuterAmt = jsondata.CommuterAmt;
        var data = [
   {
       attributes: {},
       geometry: {
           spatialReference: { wkid: 102100 },
           type: "point",
           x: coordXicon,
           y: coordYicon,
           weight: commuterAmt
       }
   }
        ];

        heatLayer.setData(data);

    });
    map.addLayer(heatLayer);
},
error: function (request, state, errors) {
}
});
}

Basically I tried to set the heat weight by commuterAmt so that it is not just simply plot a heat at each coordinates that I declared. However, it does not work. For every point on the map, it just simply plot a heat without taking account into the commuterAmt.

enter image description here

Attached image shows the heat plotted on each bus stop. Although each bus stop has different commuterAmt but the heat seems all the same.

I wonder is there any alternate way to set the weight as the heatmap used in Google Maps.

Best Answer

Basically I just set a count attributes as the following codes:

             data.push(
                {
                    attributes: {count:commuterAmt},
                    geometry: {
                        spatialReference: { wkid: 102100 },
                        type: "point",
                        x: coordXicon,
                        y: coordYicon
                    }
                }
           );
Related Question