title: Formatting Interpolated String or Number in d3
body: <p>I'm using d3 to animate text to show a user's progress towards completing a task.  For example, if they've completed 32.51% of the task, the text will animate from 0% to 32.51% over 2 seconds or so. </p>
  
  <p>To do this, I'm using d3's attrTween method on an svg text element in conjunction with d3.interpolate. The interpolation is working great, but I'm having a little trouble formatting the text.  I'd like the text to always display 4 digits, so 0% = 00.00%, 4.31% = 04.31% etc.  It would be nice to be able to do this without necessarily having to post process what the interpolator returns.  In other words, without having to take the returned percentage and check to see if there are 4 digits and add zero padding on either side before placing it in the DOM.  </p>
  
  <p>As a test, I tried specifying the format that I would like by setting the a and b values to the interpolator like so <code>d3.interpolate("00.00", "30.00")</code>, but the final text is "30" with the trailing zeros cut off.</p>
  
  <p>Any suggestions?</p>