title: How can I vary my line thickness in HTML canvas?
body: <p>I have an example here</p>
  
  <p><a href="http://jsfiddle.net/8NzjH/" rel="noreferrer">http://jsfiddle.net/8NzjH/</a></p>
  
  <p>I'm trying to draw a thick middle line as follows:</p>
  
  <pre><code>var context = canvas.getContext("2d");
  context.strokeStyle = '#000000';
  context.fillStyle = '#000000';
  
  context.moveTo(10, 10);
  context.lineTo(50, 10);
  
  context.save();
  context.lineWidth = 15;
  context.moveTo(10, 30);
  context.lineTo(50, 30);
  context.restore();
  
  context.moveTo(10, 50);
  context.lineTo(50, 50);
  
  context.stroke();
  </code></pre>
  
  <p>What I do is save the context, change the line width, draw the line and then restore the context.  However the thicknesses of all lines are the same.  What am I doing wrong?</p>