Fix for doughnut rotation = 0, added unit test for doughnut rotation/circumference...

diff --git a/src/controllers/controller.doughnut.js b/src/controllers/controller.doughnut.js
index 380c8bddb51aa4b1a5f9a0a28489365c15c3a2bd..d55dcf47ddc22de3452ee5b5554ca4681b1b4e61 100644 (file)
--- a/src/controllers/controller.doughnut.js
+++ b/src/controllers/controller.doughnut.js
@@ -156,7 +156,7 @@ module.exports = function(Chart) {
                        var offset = {x: 0, y: 0};
 
                        // If the chart's circumference isn't a full circle, calculate minSize as a ratio of the width/height of the arc
-                       if (this.chart.options.circumference && this.chart.options.circumference < Math.PI * 2.0) {
+                       if (this.chart.options.circumference < Math.PI * 2.0) {
                                var startAngle = this.chart.options.rotation % (Math.PI * 2.0);
                                startAngle += Math.PI * 2.0 * (startAngle >= Math.PI ? -1 : startAngle < -Math.PI ? 1 : 0);
                                var endAngle = startAngle + this.chart.options.circumference;
@@ -197,9 +197,9 @@ module.exports = function(Chart) {
                updateElement: function(arc, index, reset) {
                        var centerX = (this.chart.chartArea.left + this.chart.chartArea.right) / 2;
                        var centerY = (this.chart.chartArea.top + this.chart.chartArea.bottom) / 2;
-                       var startAngle = this.chart.options.rotation || (Math.PI * -0.5); // non reset case handled later
-                       var endAngle = this.chart.options.rotation || (Math.PI * -0.5); // non reset case handled later
-                       var circumference = reset && this.chart.options.animation.animateRotate ? 0 : this.calculateCircumference(this.getDataset().data[index]) * ((this.chart.options.circumference || (2.0 * Math.PI)) / (2.0 * Math.PI));
+                       var startAngle = this.chart.options.rotation; // non reset case handled later
+                       var endAngle = this.chart.options.rotation; // non reset case handled later
+                       var circumference = reset && this.chart.options.animation.animateRotate ? 0 : this.calculateCircumference(this.getDataset().data[index]) * (this.chart.options.circumference / (2.0 * Math.PI));
                        var innerRadius = reset && this.chart.options.animation.animateScale ? 0 : this.innerRadius;
                        var outerRadius = reset && this.chart.options.animation.animateScale ? 0 : this.outerRadius;
 
@@ -232,7 +232,7 @@ module.exports = function(Chart) {
                        if (!reset) {
 
                                if (index === 0) {
-                                       arc._model.startAngle = this.chart.options.rotation || (Math.PI * -0.5);
+                                       arc._model.startAngle = this.chart.options.rotation;
                                } else {
                                        arc._model.startAngle = this.getDataset().metaData[index - 1]._model.endAngle;
                                }
@@ -270,7 +270,7 @@ module.exports = function(Chart) {
 
                calculateCircumference: function(value) {
                        if (this.getDataset().total > 0 && !isNaN(value)) {
-                               return (Math.PI * 1.999999) * (value / this.getDataset().total);
+                               return (Math.PI * 2.0) * (value / this.getDataset().total);
                        } else {
                                return 0;
                        }

diff --git a/test/controller.doughnut.tests.js b/test/controller.doughnut.tests.js
index bed2da5aa79f9be09804e626a7381ac4a61ed1ed..e22620f82f15e426329e3b24221d2e978a8c38d0 100644 (file)
--- a/test/controller.doughnut.tests.js
+++ b/test/controller.doughnut.tests.js
@@ -68,6 +68,8 @@ describe('Doughnut controller tests', function() {
                                        animateScale: false
                                },
                                cutoutPercentage: 50,
+                               rotation: Math.PI * -0.5,
+                               circumference: Math.PI * 2.0,
                                elements: {
                                        arc: {
                                                backgroundColor: 'rgb(255, 0, 0)',
@@ -87,7 +89,7 @@ describe('Doughnut controller tests', function() {
                        y: 100,
                        startAngle: Math.PI * -0.5,
                        endAngle: Math.PI * -0.5,
-                       circumference: 2.166614539857563,
+                       circumference: 2.1666156231653746,
                        outerRadius: 49,
                        innerRadius: 36.75
                }));
@@ -97,7 +99,7 @@ describe('Doughnut controller tests', function() {
                        y: 100,
                        startAngle: Math.PI * -0.5,
                        endAngle: Math.PI * -0.5,
-                       circumference: 3.2499218097863447,
+                       circumference: 3.249923434748062,
                        outerRadius: 49,
                        innerRadius: 36.75
                }));
@@ -117,7 +119,7 @@ describe('Doughnut controller tests', function() {
                        y: 100,
                        startAngle: Math.PI * -0.5,
                        endAngle: Math.PI * -0.5,
-                       circumference: 0.8666458159430251,
+                       circumference: 0.8666462492661499,
                        outerRadius: 49,
                        innerRadius: 36.75
                }));
@@ -128,8 +130,8 @@ describe('Doughnut controller tests', function() {
                        x: 50,
                        y: 100,
                        startAngle: Math.PI * -0.5,
-                       endAngle: 0.5958182130626666,
-                       circumference: 2.166614539857563,
+                       endAngle: 0.595819296370478,
+                       circumference: 2.1666156231653746,
                        outerRadius: 49,
                        innerRadius: 36.75,
 
@@ -144,9 +146,9 @@ describe('Doughnut controller tests', function() {
                expect(chart.data.datasets[1].metaData[1]._model).toEqual(jasmine.objectContaining({
                        x: 50,
                        y: 100,
-                       startAngle: 0.5958182130626666,
-                       endAngle: 3.8457400228490113,
-                       circumference: 3.2499218097863447,
+                       startAngle: 0.595819296370478,
+                       endAngle: 3.84574273111854,
+                       circumference: 3.249923434748062,
                        outerRadius: 49,
                        innerRadius: 36.75,
 
@@ -161,8 +163,8 @@ describe('Doughnut controller tests', function() {
                expect(chart.data.datasets[1].metaData[2]._model).toEqual(jasmine.objectContaining({
                        x: 50,
                        y: 100,
-                       startAngle: 3.8457400228490113,
-                       endAngle: 3.8457400228490113,
+                       startAngle: 3.84574273111854,
+                       endAngle: 3.84574273111854,
                        circumference: 0,
                        outerRadius: 49,
                        innerRadius: 36.75,
@@ -178,9 +180,9 @@ describe('Doughnut controller tests', function() {
                expect(chart.data.datasets[1].metaData[3]._model).toEqual(jasmine.objectContaining({
                        x: 50,
                        y: 100,
-                       startAngle: 3.8457400228490113,
-                       endAngle: 4.712385838792036,
-                       circumference: 0.8666458159430251,
+                       startAngle: 3.84574273111854,
+                       endAngle: 4.71238898038469,
+                       circumference: 0.8666462492661499,
                        outerRadius: 49,
                        innerRadius: 36.75,
 
@@ -188,7 +190,7 @@ describe('Doughnut controller tests', function() {
                        borderColor: 'rgb(0, 0, 255)',
                        borderWidth: 2,
                        hoverBackgroundColor: 'rgb(255, 255, 255)',
-                       
+
                        label: 'label3'
                }));
 
@@ -213,6 +215,66 @@ describe('Doughnut controller tests', function() {
                expect(chart.data.datasets[1].metaData[3] instanceof Chart.elements.Arc).toBe(true);
        });
 
+       it ('Should rotate and limit circumference', function() {
+               var chart = {
+                       chartArea: {
+                               left: 0,
+                               top: 0,
+                               right: 200,
+                               bottom: 100,
+                       },
+                       data: {
+                               datasets: [{
+                                       hidden: true
+                               }, {
+                                       data: [1, 3]
+                               }, {
+                                       data: [1]
+                               }],
+                               labels: ['label0', 'label1']
+                       },
+                       config: {
+                               type: 'doughnut'
+                       },
+                       options: {
+                               animation: {
+                                       animateRotate: false,
+                                       animateScale: false
+                               },
+                               cutoutPercentage: 50,
+                               rotation: Math.PI,
+                               circumference: Math.PI * 0.5,
+                               elements: {
+                                       arc: {
+                                               backgroundColor: 'rgb(255, 0, 0)',
+                                               borderColor: 'rgb(0, 0, 255)',
+                                               borderWidth: 2,
+                                               hoverBackgroundColor: 'rgb(255, 255, 255)'
+                                       }
+                               }
+                       }
+               };
+
+               var controller = new Chart.controllers.doughnut(chart, 1);
+               controller.update();
+
+               expect(chart.data.datasets[1].metaData[0]._model.x).toEqual(149);
+               expect(chart.data.datasets[1].metaData[0]._model.y).toEqual(99);
+               expect(chart.data.datasets[1].metaData[0]._model.startAngle).toBeCloseTo(Math.PI, 10);
+               expect(chart.data.datasets[1].metaData[0]._model.endAngle).toBeCloseTo(Math.PI + Math.PI / 8, 10);
+               expect(chart.data.datasets[1].metaData[0]._model.circumference).toBeCloseTo(Math.PI / 8, 10);
+               expect(chart.data.datasets[1].metaData[0]._model.outerRadius).toBeCloseTo(98, 10);
+               expect(chart.data.datasets[1].metaData[0]._model.innerRadius).toBeCloseTo(73.5, 10);
+
+               expect(chart.data.datasets[1].metaData[1]._model.x).toEqual(149);
+               expect(chart.data.datasets[1].metaData[1]._model.y).toEqual(99);
+               expect(chart.data.datasets[1].metaData[1]._model.startAngle).toBeCloseTo(Math.PI + Math.PI / 8, 10);
+               expect(chart.data.datasets[1].metaData[1]._model.endAngle).toBeCloseTo(Math.PI + Math.PI / 2, 10);
+               expect(chart.data.datasets[1].metaData[1]._model.circumference).toBeCloseTo(3 * Math.PI / 8, 10);
+               expect(chart.data.datasets[1].metaData[1]._model.outerRadius).toBeCloseTo(98, 10);
+               expect(chart.data.datasets[1].metaData[1]._model.innerRadius).toBeCloseTo(73.5, 10);
+       });
+
        it ('should draw all arcs', function() {
                var chart = {
                        chartArea: {