<div id='description'>
<h3><code>stackOffset().stackOrder();</code></h3>
<p>Stack offset shift the  baseline of the chart to give more emphasis on the changing values. There are different ways to set the offset and by default it is set to <code>'stackOffsetNone'</code>. All the offset properties can be found <a href="https://github.com/d3/d3-shape/blob/master/README.md#stackOffsetExpand" target="_blank">here</a>.</p>
  
<p>Stack order is the way of ordering the charts and by default set to<code>'stackOrderNone'</code>. All the stack order properties can be found 
 <a href="https://github.com/d3/d3-shape/blob/master/README.md#stack-orders" target="_blank"> here.</a></p>
  
<p><code>StackOffset</code> works in relation with <code>stackOrder</code> to create streamgraph.</p>
<p>The offset is set to <code>'stackOffsetWiggle'</code> and order to <code>'stackOrderInsideOut'</code> on the chart below which is commonly used for streamgraph.</p>
<div id='chart'></div>  
<p>NOTE:<code>stacked()</code> need to be set to <code>true</code> for stacking to work.</code></p>  
</div>  

#description{
  margin: 1em;
}

//Redsift
//stackOffset();
//shift the chart over or under the baseline 

let dataSet = [{ 'l': 1,'v': [1, 4, 5,4]}, 
               { 'l': 3,'v': [4, 3, 1,8]}, 
               { 'l': 6,'v': [5, 6, 6,2]},
               { 'l': 8,'v': [6, 7, 2,6]},
               { 'l': 9,'v': [10, 7, 5,2]}
              ];

let chart = d3_rs_lines.html()
  .stacked(true)              //stack chart enabled
  .stackOffset('stackOffsetWiggle') //set the offset
  .stackOrder('stackOrderInsideOut');  //set the order 

d3.select('#chart')
  .datum(dataSet)
  .call(chart);