D3 Examples - sequence explorer

xxxxxxxxxx
 
<!DOCTYPE html>
  <meta charset="utf-8"> <!-- also save this file as unicode-8 ! -->
  <head>
    <link rel="stylesheet" type="text/css" href="sankeySeqExplorer.css">
  
  <!--script src="../../../lib/d3_v4_2_1/d3.js"></script-->
  <script src="https://d3js.org/d3.v4.js"></script> 
  <script src="sankeySeqExplorer.js"></script>
  <script src="sankeySeq.js"></script>
  </head>
  
  <body>
  
  <!-- A: paste data in pre#data tag -->
  <pre id="data">
value,sourceX,sourceY,targetX,targetY
100,2000,1,2001,0,100
100,2000,1,2001,1,100
10,2000,1,2001,2,10
10,2000,1,2001,3+,10
100,2000,2,2001,2,100
120,2000,2,2001,0,120
100,2001,1,2002,1,100
10,2002,1,2003,2,10
90,2002,1,2003,1,90
</pre> 
​
<!-- A: paste node infos in pre#dataNodes tag -->
<pre id="dataNodes"></pre>
​
    <script>
    // no parameter when data is embedded in <pre id="data"> tag, otherwise reUsableChart(file);
    // var myChart = reUsableChart()
    var myChart = reUsableChart("sankey_new_n2.csv")
    .nodeWidth(15)
    .nodePadding(10)
    .debugOn(false)
    .size([800, 600])
    // .margin(20)
    //.sequence(["2003","2002","2001","2000"])
    //.categories(["3+", "2", "1", "0"])
    .sequenceName("year")
    .categoryName("mood")
    ; 
      
    d3.select("body")
      .append("div")
      .attr("class", "chart")
      .call(myChart);
      
    </script>
  </body>
</html>  
    