Data:

A visualization of the frequency and location of instagram photos tagged with #aokhalifax, a grass roots initiative to brighten the perspective of citizens and tourists: the goal being to promote positivity in Halifax.

Options:

• size: in meters (default: 30km)
• opacity: in percent/100 (default: 1)
• gradientTexture: url-to-texture-image (default: false)
• alphaRange: change transparency in heatmap (default: 1)
• autoresize: resize heatmap when map size changes (default: false)

Usage:

	var baseURL = 'http://{s}.tile.cloudmade.com/{API}/{map_style}/256/{z}/{x}/{y}.png';
    
	var base = L.tileLayer(baseURL, { 
		API: your-api, 
		map_style: '44094' 
		});
    
	//Halifax, Nova Scotia
	var map = L.map('map', {layers: [base]}).setView([44.65, -63.57], 12);
    
	L.control.scale().addTo(map);
	
	//custom size for this example, and autoresize because map style has a percentage width
	var heatmap = new L.TileLayer.WebGLHeatMap({size: 1000, autoresize: true}); 
	
	// dataPoints is an array of arrays: [[lat, lng, intensity]...]
	var dataPoints = [[44.6674, -63.5703, 37], [44.6826, -63.7552, 34], [44.6325, -63.5852, 41], [44.6467, -63.4696, 67], [44.6804, -63.487, 64], [44.6622, -63.5364, 40], [44.603, - 63.743, 52] ...];
	for (var i = 0, len = dataPoints.length; i < len; i++) {
		var point = dataPoints[i];
		heatmap.addDataPoint(point[0],
			 point[1],
			 point[2]);
	}
	// alternatively, you can skip the for loop and add the whole dataset with heatmap.setData(dataPoints)
	
	map.addLayer(heatmap);