title: d3.js line().x(x).y(y)
body: <p>I am studying the bezier curve from <a href="http://www.jasondavies.com/animated-bezier/" rel="nofollow">this</a> demo, in the beginning it defines a series variables like this</p>
  
  <pre><code>var w = 250,
      h = 300,
      t = .5,
      delta = .01,
      padding = 10,
      points = [{x: 10, y: 250}, {x: 0, y: 0}, {x: 100, y: 0}, {x: 200, y: 250}, {x: 225, y: 125}], 
  
      bezier = {},
      line = d3.svg.line().x(x).y(y),
      n = 4,
      stroke = d3.scale.category20b(),
      orders = d3.range(2, n + 2);
  </code></pre>
  
  <p>I have no idea what does <code>line = d3.svg.line().x(x).y(y)</code> mean, can anyone explain? </p>