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.
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);