Add the following 2 scripts to your HTML page, after your google script link:
<script type="text/javascript" src="http://www.heatmapapi.com/Javascript/HeatmapAPIGoogle3.js"></script>
<script type="text/javascript" src="http://www.heatmapapi.com/Javascript/HeatMapAPI3.aspx?k=YOUR KEY FROM STEP 2"></script>
If your not already linking in jQuery, you'll need to do that:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
var myHeatmap = new GEOHeatmap();
var myData = null;
$(function() {
// configure HeatMapAPI
myHeatmap.Init(400, 300); // set at pixels for your map
myHeatmap.SetBoost(0.8);
myHeatmap.SetDecay(0); // see documentation
myHeatmap.SetData(''); // data comes from proxy page
myHeatmap.ImageURL('YourGetImagePage.aspx?k=0');
// Note do not declare a proxy use ImageURL instead
// set up Google map, pass in the heatmap function
var myLatlng = new google.maps.LatLng(38.5, -121.8);
var myOptions = {
zoom: 11,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map"), myOptions);
google.maps.event.addListener(map, 'idle', function(event) {
myHeatmap.AddOverlay(this, myHeatmap);
});
});
</script>
|