Show how to use circumference and rotation options (#5326)

diff --git a/samples/charts/doughnut.html b/samples/charts/doughnut.html
index 446dcee4e2e9da1fd683d0592b314de4bd328b7c..8466970a4033998f114ce558042074731b4a7c20 100644 (file)
--- a/samples/charts/doughnut.html
+++ b/samples/charts/doughnut.html
@@ -23,6 +23,7 @@
        <button id="removeDataset">Remove Dataset</button>
        <button id="addData">Add Data</button>
        <button id="removeData">Remove Data</button>
+       <button id="changeCircleSize">Semi/Full Circle</button>
        <script>
                var randomScalingFactor = function() {
                        return Math.round(Math.random() * 100);
@@ -138,6 +139,18 @@
 
                        window.myDoughnut.update();
                });
+
+               document.getElementById('changeCircleSize').addEventListener('click', function() {
+                       if (window.myDoughnut.options.circumference === Math.PI) {
+                               window.myDoughnut.options.circumference = 2 * Math.PI;
+                               window.myDoughnut.options.rotation = -Math.PI / 2;
+                       } else {
+                               window.myDoughnut.options.circumference = Math.PI;
+                               window.myDoughnut.options.rotation = -Math.PI;
+                       }
+
+                       window.myDoughnut.update();
+               });
        </script>
 </body>