linecap.js Example File

  var ctx = document.getElementById('tutorial').getContext('2d');
    var lineCap = ['butt','round','square'];

    // Draw guides
    ctx.save();
    ctx.strokeStyle = '#09f';
    ctx.beginPath();
    ctx.moveTo(10,10);
    ctx.lineTo(140,10);
    ctx.moveTo(10,140);
    ctx.lineTo(140,140);
    ctx.stroke();

    // Draw lines
    ctx.strokeStyle = 'black';
    for (i=0;i<lineCap.length;i++){
      ctx.lineWidth = 15;
      ctx.lineCap = lineCap[i];
      ctx.beginPath();
      ctx.moveTo(25+i*50,10);
      ctx.lineTo(25+i*50,140);
      ctx.stroke();
    }
    ctx.restore();