diff options
| author | ARC <arjunrc@gmail.com> | 2015-05-17 11:43:25 -0400 |
|---|---|---|
| committer | ARC <arjunrc@gmail.com> | 2015-05-17 11:43:25 -0400 |
| commit | 8c877315a6b3fe6abe4168ca8c39f161a0b6da86 (patch) | |
| tree | e822ba2256bfa55485e4931485661f6186e32000 /www/lib/Chart.js/samples/doughnut.html | |
| parent | 24d9325ede86d5688bbe14979e499effe5e5a284 (diff) | |
Switched from google-chart back to chart.js - I couldn't get axis animations right with google
Diffstat (limited to 'www/lib/Chart.js/samples/doughnut.html')
| -rw-r--r-- | www/lib/Chart.js/samples/doughnut.html | 67 |
1 files changed, 67 insertions, 0 deletions
diff --git a/www/lib/Chart.js/samples/doughnut.html b/www/lib/Chart.js/samples/doughnut.html new file mode 100644 index 00000000..fdf7539a --- /dev/null +++ b/www/lib/Chart.js/samples/doughnut.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> + <head> + <title>Doughnut Chart</title> + <script src="../Chart.js"></script> + <style> + body{ + padding: 0; + margin: 0; + } + #canvas-holder{ + width:30%; + } + </style> + </head> + <body> + <div id="canvas-holder"> + <canvas id="chart-area" width="500" height="500"/> + </div> + + + <script> + + var doughnutData = [ + { + value: 300, + color:"#F7464A", + highlight: "#FF5A5E", + label: "Red" + }, + { + value: 50, + color: "#46BFBD", + highlight: "#5AD3D1", + label: "Green" + }, + { + value: 100, + color: "#FDB45C", + highlight: "#FFC870", + label: "Yellow" + }, + { + value: 40, + color: "#949FB1", + highlight: "#A8B3C5", + label: "Grey" + }, + { + value: 120, + color: "#4D5360", + highlight: "#616774", + label: "Dark Grey" + } + + ]; + + window.onload = function(){ + var ctx = document.getElementById("chart-area").getContext("2d"); + window.myDoughnut = new Chart(ctx).Doughnut(doughnutData, {responsive : true}); + }; + + + + </script> + </body> +</html> |