Rickshaw Charts

Rickshaw Charts

Rickshaw is a JavaScript toolkit for creating interactive time series graphs.

1. Initialize the plugin by referencing the necessary files:
                    
                        <link rel="stylesheet" type="text/css" href="/path/to/rickshaw.css">
                        <script src="/path/to/d3.min.js"></script>
                        <script src="/path/to/rickshaw.min.js"></script>
                    
                
2. HTML code to specify a container.
                    
                        <div id="dimple-chart"></div>
                    
                
3. Basic usage may look something like this.
                    
                        var svg = dimple.newSvg("#dimple-chart", 800, 600);
                        var data = [
                            { "Word":"Hello", "Awesomeness":2000 },
                            { "Word":"World", "Awesomeness":3000 }
                        ];
                        var chart = new dimple.chart(svg, data);
                        chart.addCategoryAxis("x", "Word");
                        chart.addMeasureAxis("y", "Awesomeness");
                        chart.addSeries(null, dimple.plot.bar);
                        chart.draw();

                    
                

Refer following links for detailed documentation, configuration options, methods and examples:

Type URL
Plugin Link http://code.shutterstock.com/rickshaw/
Github Page https://github.com/shutterstock/rickshaw
Template Page http://demo.pixinvent.com/robust-admin/ltr/vertical-menu-template/rickshaw-charts.html