title: D3 - Difference between basis and linear interpolation in SVG line
body: <p>I implemented a multi-series line chart like the one given <a href="http://bl.ocks.org/mbostock/3884955" rel="noreferrer">here</a> by M. Bostock and ran into a curious issue which I cannot explain myself. When I choose linear interpolation and set my scales and axis everything is correct and values are well-aligned.
  <img src="https://i.stack.imgur.com/oZ8kM.png" alt="Linear interpolation"></p>
  
  <p>But when I change my interpolation to basis, without any modification of my axis and scales, values between the lines and the axis are incorrect.</p>
  
  <p><img src="https://i.stack.imgur.com/J4ZCW.png" alt="Basis interpolation"></p>
  
  <p>What is happening here? With the monotone setting I can achieve pretty much the same effect as the basis interpolation but without the syncing problem between lines and axis. Still I would like to understand what is happening.</p>