canvas lineTo og shadowBlur

var elem = $('#draw'),
  letsdraw = false,
  ctx = elem[0].getContext('2d'),
  canvasOffset = elem.offset();

elem.mousedown(function(){
  letsdraw = true;
  ctx.strokeStyle = 'white';
  ctx.shadowBlur = 1;
  ctx.shadowColor = 'rgb(0, 0, 0)';
  ctx.lineWidth = 5;
  ctx.lineJoin = ctx.lineCap = 'round';
  ctx.beginPath();
  ctx.moveTo(e.pageX - canvasOffset.left, e.pageY - canvasOffset.top);
  });

elem.mousemove(function(e){
  if(letsdraw){
    ctx.lineTo(e.pageX - canvasOffset.left, e.pageY - canvasOffset.top);
    ctx.stroke();
    };
  });

$(window).mouseup(function(){ letsdraw = false; });

Jeg er begyndt at rode lidt med freehand drawing på en hjemmeside.
Det er lykkedes mig at få den til at tegne en hvid streg med sorte kanter(outline).

Hvis man tegner i en lang streg og lader stregen krydse sig selv så laver den et fint x. hvor de sorte kanter gemmer sig bagved stregen - en slags outline. Men hvis man tegner to streger, så laver den kanter på den øverste streg og gemmer den anden streg nedenunder.

Er det på nogen måde muligt at efterligne effekten med krydset ved en lang streg, når man laver det som flere streger? Altså en slags outline på tegningens samlede streger.