Playing around with globalCompositeOperation for an upcoming heatmap.js fix

globalcomptests.js

var composites = [
  'source-over','source-in','source-out','source-atop',
  'destination-over','destination-in','destination-out','destination-atop',
  'lighter','darker','copy','xor'
];
for(var i = 0; i < composites.length; i++){
(function(comp){
   var canvas = document.createElement('canvas'),
    ctx = canvas.getContext('2d');

canvas.width = 200;
canvas.height = 100;

document.body.appendChild(canvas);

var rgr = ctx.createRadialGradient(50, 50, 0, 50, 50, 40);
rgr.addColorStop(0, 'rgba(0,0,0,0.5)');
rgr.addColorStop(1, 'rgba(0,0,0,0)');

ctx.fillStyle = rgr;
ctx.fillRect(10, 10, 80, 80);


var rgr = ctx.createRadialGradient(80, 50, 0, 80, 50, 40);
rgr.addColorStop(0, 'rgba(0,0,0,0.5)');
rgr.addColorStop(1, 'rgba(0,0,0,0)');

ctx.globalCompositeOperation = comp;

ctx.fillStyle = rgr;
ctx.fillRect(40, 10, 80, 80);
})(composites[i]);
}