title: Gradient along links in D3 Sankey diagram
body: <p><a href="http://jsfiddle.net/VividD/CeAZQ/" rel="noreferrer">Here</a> is jsfiddle of a <code>Sankey diagram</code>:</p>
  
  <p><img src="https://i.stack.imgur.com/D52Y0.gif" alt="enter image description here"></p>
  
  <p>I am trying to modify colors of the links so that the color of each link is actually gradient from its source node color to its target node color. (it is assumed that opacity will remain 0.2 or 0.5 depending whether a mouse hovers or not over the link; so links will remain a little "paler" than nodes)</p>
  
  <p>I took a look at this nice and instructive <a href="https://gist.github.com/mbostock/4163057" rel="noreferrer">example</a>, which draws this gradient filled loop:</p>
  
  <p><img src="https://i.stack.imgur.com/Ul1rj.png" alt="enter image description here"></p>
  
  <p>However, I simply couldn't integrate that solution to mine, it looks too complex for the given task.</p>
  
  <p>Also, note that links in original Sankey diagram move while node is being dragged, and must display gradient even in those transitory states. A slight problem is also transparency of links and nodes, and order of drawing. I would appreciate ideas, hints.</p>