D3 WATERFALL CHART

v.0.0.2

You basically provide an object to the Waterfall function and it will spit out a waterfall chart. You will need a container in you HTML which ID matches the container property of the config object like so

  
    ‹body›
       ‹div id="chart"› ‹/div›
       ‹script src="libs/d3.v3.min.js"› ‹/script›
     ‹/body›
  

Once the HTML is set you create the config object as follows

  
  var waterfall = {
      container:'chart',
      width:400,
      height:800,
      fontSize:10,
      borderRadius:5,
      horizontalGridLines:true,
      series:[
        {'value':253},
        {'value':417},
        {'value':1440},
        .
        .
        .
        .
      ]
    }
  

After creating the conf object you simply pass it as a parameter to createWaterfall() function like so

  
    createWaterfall(waterfall);
  

#Todos

• Need to add support for labels on each row
• Add config for format
• Add config for horizontal display
• Add config for animation