Created
April 11, 2015 05:47
-
-
Save thiakx/39b66d0eef14ed2c2f1d to your computer and use it in GitHub Desktop.
test
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype HTML> | |
| <html> | |
| <head> | |
| <link rel='stylesheet' href='//cdn.strategiqcommerce.com/ajax/libs/rickshaw/1.2.1/rickshaw.min.css'> | |
| <link rel='stylesheet' href='//ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css'> | |
| <script src='//d3js.org/d3.v2.min.js' type='text/javascript'></script> | |
| <script src='//cdn.strategiqcommerce.com/ajax/libs/rickshaw/1.2.1/rickshaw.min.js' type='text/javascript'></script> | |
| <script src='//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'></script> | |
| <script src='//ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.min.js' type='text/javascript'></script> | |
| <style> | |
| .chart_container { | |
| position: relative; | |
| display: inline-block; | |
| font-family: Arial, Helvetica, sans-serif; | |
| } | |
| .rChart { | |
| display: inline-block; | |
| margin-left: 40px; | |
| } | |
| .yAxis { | |
| position: absolute; | |
| top: 0; | |
| bottom: 0; | |
| width: 40px; | |
| } | |
| .legend { | |
| position: absolute; | |
| top: 0; | |
| right: -160px; | |
| vertical-align: top; | |
| } | |
| .slider { | |
| margin-left: 40px; | |
| margin-top: 12px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class='chart_container'> | |
| <div id='yAxischart1205f2c9fc9' class='yAxis'></div> | |
| <div id='chart1205f2c9fc9' class='rChart rickshaw'></div> | |
| <div id='xAxischart1205f2c9fc9' class='xAxis'></div> | |
| <div id='legendchart1205f2c9fc9' class='legend'></div> | |
| <div id='sliderchart1205f2c9fc9' class='slider'></div> | |
| </div> | |
| <script type='text/javascript'> | |
| var palette = new Rickshaw.Color.Palette({ scheme: "colorwheel" }); | |
| var chartParams = { | |
| "dom": "chart1205f2c9fc9", | |
| "width": 560, | |
| "height": 400, | |
| "scheme": "colorwheel", | |
| "series": [ | |
| { | |
| "data": [ | |
| { | |
| "x": -946797600, | |
| "y": 22.2 | |
| }, | |
| { | |
| "x": -788950800, | |
| "y": 44.5 | |
| }, | |
| { | |
| "x": -631179000, | |
| "y": 59.6 | |
| }, | |
| { | |
| "x": -473412600, | |
| "y": 73.2 | |
| }, | |
| { | |
| "x": -315646200, | |
| "y": 86.8 | |
| } | |
| ], | |
| "name": "Food and Tobacco", | |
| "info": { | |
| "-946797600": { | |
| "Var1": "Food and Tobacco", | |
| "Var2": -946797600 | |
| }, | |
| "-788950800": { | |
| "Var1": "Food and Tobacco", | |
| "Var2": -788950800 | |
| }, | |
| "-631179000": { | |
| "Var1": "Food and Tobacco", | |
| "Var2": -631179000 | |
| }, | |
| "-473412600": { | |
| "Var1": "Food and Tobacco", | |
| "Var2": -473412600 | |
| }, | |
| "-315646200": { | |
| "Var1": "Food and Tobacco", | |
| "Var2": -315646200 | |
| } | |
| }, | |
| "color": palette.color() | |
| }, | |
| { | |
| "data": [ | |
| { | |
| "x": -946797600, | |
| "y": 10.5 | |
| }, | |
| { | |
| "x": -788950800, | |
| "y": 15.5 | |
| }, | |
| { | |
| "x": -631179000, | |
| "y": 29 | |
| }, | |
| { | |
| "x": -473412600, | |
| "y": 36.5 | |
| }, | |
| { | |
| "x": -315646200, | |
| "y": 46.2 | |
| } | |
| ], | |
| "name": "Household Operation", | |
| "info": { | |
| "-946797600": { | |
| "Var1": "Household Operation", | |
| "Var2": -946797600 | |
| }, | |
| "-788950800": { | |
| "Var1": "Household Operation", | |
| "Var2": -788950800 | |
| }, | |
| "-631179000": { | |
| "Var1": "Household Operation", | |
| "Var2": -631179000 | |
| }, | |
| "-473412600": { | |
| "Var1": "Household Operation", | |
| "Var2": -473412600 | |
| }, | |
| "-315646200": { | |
| "Var1": "Household Operation", | |
| "Var2": -315646200 | |
| } | |
| }, | |
| "color": palette.color() | |
| }, | |
| { | |
| "data": [ | |
| { | |
| "x": -946797600, | |
| "y": 3.53 | |
| }, | |
| { | |
| "x": -788950800, | |
| "y": 5.76 | |
| }, | |
| { | |
| "x": -631179000, | |
| "y": 9.71 | |
| }, | |
| { | |
| "x": -473412600, | |
| "y": 14 | |
| }, | |
| { | |
| "x": -315646200, | |
| "y": 21.1 | |
| } | |
| ], | |
| "name": "Medical and Health", | |
| "info": { | |
| "-946797600": { | |
| "Var1": "Medical and Health", | |
| "Var2": -946797600 | |
| }, | |
| "-788950800": { | |
| "Var1": "Medical and Health", | |
| "Var2": -788950800 | |
| }, | |
| "-631179000": { | |
| "Var1": "Medical and Health", | |
| "Var2": -631179000 | |
| }, | |
| "-473412600": { | |
| "Var1": "Medical and Health", | |
| "Var2": -473412600 | |
| }, | |
| "-315646200": { | |
| "Var1": "Medical and Health", | |
| "Var2": -315646200 | |
| } | |
| }, | |
| "color": palette.color() | |
| }, | |
| { | |
| "data": [ | |
| { | |
| "x": -946797600, | |
| "y": 1.04 | |
| }, | |
| { | |
| "x": -788950800, | |
| "y": 1.98 | |
| }, | |
| { | |
| "x": -631179000, | |
| "y": 2.45 | |
| }, | |
| { | |
| "x": -473412600, | |
| "y": 3.4 | |
| }, | |
| { | |
| "x": -315646200, | |
| "y": 5.4 | |
| } | |
| ], | |
| "name": "Personal Care", | |
| "info": { | |
| "-946797600": { | |
| "Var1": "Personal Care", | |
| "Var2": -946797600 | |
| }, | |
| "-788950800": { | |
| "Var1": "Personal Care", | |
| "Var2": -788950800 | |
| }, | |
| "-631179000": { | |
| "Var1": "Personal Care", | |
| "Var2": -631179000 | |
| }, | |
| "-473412600": { | |
| "Var1": "Personal Care", | |
| "Var2": -473412600 | |
| }, | |
| "-315646200": { | |
| "Var1": "Personal Care", | |
| "Var2": -315646200 | |
| } | |
| }, | |
| "color": palette.color() | |
| }, | |
| { | |
| "data": [ | |
| { | |
| "x": -946797600, | |
| "y": 0.341 | |
| }, | |
| { | |
| "x": -788950800, | |
| "y": 0.974 | |
| }, | |
| { | |
| "x": -631179000, | |
| "y": 1.8 | |
| }, | |
| { | |
| "x": -473412600, | |
| "y": 2.6 | |
| }, | |
| { | |
| "x": -315646200, | |
| "y": 3.64 | |
| } | |
| ], | |
| "name": "Private Education", | |
| "info": { | |
| "-946797600": { | |
| "Var1": "Private Education", | |
| "Var2": -946797600 | |
| }, | |
| "-788950800": { | |
| "Var1": "Private Education", | |
| "Var2": -788950800 | |
| }, | |
| "-631179000": { | |
| "Var1": "Private Education", | |
| "Var2": -631179000 | |
| }, | |
| "-473412600": { | |
| "Var1": "Private Education", | |
| "Var2": -473412600 | |
| }, | |
| "-315646200": { | |
| "Var1": "Private Education", | |
| "Var2": -315646200 | |
| } | |
| }, | |
| "color": palette.color() | |
| } | |
| ], | |
| "renderer": "area", | |
| "id": "chart1205f2c9fc9" | |
| } | |
| chartParams.element = document.querySelector('#chart1205f2c9fc9') | |
| var graphchart1205f2c9fc9 = new Rickshaw.Graph(chartParams); | |
| graphchart1205f2c9fc9.render(); | |
| var xAxischart1205f2c9fc9 = new Rickshaw.Graph.Axis.Time({ | |
| "graph": graphchart1205f2c9fc9 | |
| }) | |
| var yAxischart1205f2c9fc9 = new Rickshaw.Graph.Axis.Y({ | |
| "graph": graphchart1205f2c9fc9 , | |
| "orientation": "left", | |
| "element": document.getElementById('yAxischart1205f2c9fc9') , | |
| "tickFormat": Rickshaw.Fixtures.Number.formatKMBT | |
| }) | |
| graphchart1205f2c9fc9.render() | |
| var legendchart1205f2c9fc9 = new Rickshaw.Graph.Legend({ | |
| "graph": graphchart1205f2c9fc9 , | |
| "element": document.getElementById('legendchart1205f2c9fc9') | |
| }) | |
| var shelvingchart1205f2c9fc9 = new Rickshaw.Graph.Behavior.Series.Toggle({ | |
| "graph": graphchart1205f2c9fc9 , | |
| "legend": legendchart1205f2c9fc9 | |
| }) | |
| var hoverDetailchart1205f2c9fc9 = new Rickshaw.Graph.HoverDetail({ | |
| "graph": graphchart1205f2c9fc9 | |
| }) | |
| var highlightchart1205f2c9fc9 = new Rickshaw.Graph.Behavior.Series.Highlight({ | |
| "graph": graphchart1205f2c9fc9 , | |
| "legend": legendchart1205f2c9fc9 | |
| }) | |
| var sliderchart1205f2c9fc9 = new Rickshaw.Graph.RangeSlider({ | |
| "graph": graphchart1205f2c9fc9 , | |
| "element": document.getElementById('sliderchart1205f2c9fc9') | |
| }) | |
| graphchart1205f2c9fc9.render(); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment