​

var canvas, ctx;

function init() {

  canvas = document.getElementById('myCanvas');

  ctx = canvas.getContext('2d');

  setShadow();

  // first green filled rectangle

  ctx.fillStyle = "#22FFDD"; // rectangle color

  ctx.fillRect(20, 20, 200, 100); 

  // second stroked rectangle

  ctx.strokeStyle = "purple"; // rectangle color

  ctx.lineWidth=10;

  ctx.strokeRect(20, 150, 200, 100); 

​

}

​

function setShadow() {

   ctx.shadowColor = "Grey"; // color

   ctx.shadowBlur = 20;           // blur level

   ctx.shadowOffsetX = 15;        // horizontal offset

   ctx.shadowOffsetY = 15;        // vertical offset

}

​

​