title: Creating a variable thickness line in d3.js
body: <p>full source code is at: <a href="http://codepen.io/geewhizbang/full/XKLdLE/" rel="nofollow">http://codepen.io/geewhizbang/full/XKLdLE/</a></p>
  
  <p>I'd like to have the stroke-width vary along the the length of the snake. Just before the end of the snake, the stroke-width should taper to zero.</p>
  
  <p>but if I write a function to do this, it doesn't know about "(d)"</p>
  
  <pre><code>        gameBoard.append('path')
               .attr("id", snakeId)
               .attr("d", interpolator(data))
               .attr('stroke-width', snakeStroke + 2)
               .attr('fill', 'none')
               .attr('stroke', config.snakeOutlineColor);
  
          gameBoard.append('path')
              .attr("d", interpolator(data))
              .attr('stroke-width', snakeStroke)
              .attr('fill', 'none')
              .attr('stroke', config.snakeColor);
  </code></pre>