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