diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js index b61b4e82e..094292b53 100644 --- a/src/controllers/controller.bar.js +++ b/src/controllers/controller.bar.js @@ -113,7 +113,7 @@ module.exports = function(Chart) { datasetLabel: this.getDataset().label, // Appearance - base: this.calculateBarBase(this.index, index), + base: reset ? yScalePoint : this.calculateBarBase(this.index, index), width: this.calculateBarWidth(numBars), backgroundColor: rectangle.custom && rectangle.custom.backgroundColor ? rectangle.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor), borderColor: rectangle.custom && rectangle.custom.borderColor ? rectangle.custom.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor), diff --git a/src/controllers/controller.doughnut.js b/src/controllers/controller.doughnut.js index 249d18fb9..92816a028 100644 --- a/src/controllers/controller.doughnut.js +++ b/src/controllers/controller.doughnut.js @@ -163,16 +163,11 @@ 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 resetModel = { - x: centerX, - y: centerY, - startAngle: Math.PI * -0.5, // use - PI / 2 instead of 3PI / 2 to make animations better. It means that we never deal with overflow during the transition function - endAngle: Math.PI * -0.5, - circumference: (this.chart.options.animation.animateRotate) ? 0 : this.calculateCircumference(this.getDataset().data[index]), - outerRadius: (this.chart.options.animation.animateScale) ? 0 : this.outerRadius, - innerRadius: (this.chart.options.animation.animateScale) ? 0 : this.innerRadius - }; + var startAngle = Math.PI * -0.5; // non reset case handled later + var endAngle = Math.PI * -0.5; // non reset case handled later + var circumference = reset && this.chart.options.animation.animateRotate ? 0 : this.calculateCircumference(this.getDataset().data[index]); + var innerRadius = reset && this.chart.options.animation.animateScale ? 0 : this.innerRadius; + var outerRadius = reset && this.chart.options.animation.animateScale ? 0 : this.outerRadius; helpers.extend(arc, { // Utility @@ -181,12 +176,14 @@ module.exports = function(Chart) { _index: index, // Desired view properties - _model: reset ? resetModel : { + _model: { x: centerX, y: centerY, - circumference: this.calculateCircumference(this.getDataset().data[index]), - outerRadius: this.outerRadius, - innerRadius: this.innerRadius, + startAngle: startAngle, + endAngle: endAngle, + circumference: circumference, + outerRadius: outerRadius, + innerRadius: innerRadius, backgroundColor: arc.custom && arc.custom.backgroundColor ? arc.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.arc.backgroundColor), hoverBackgroundColor: arc.custom && arc.custom.hoverBackgroundColor ? arc.custom.hoverBackgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().hoverBackgroundColor, index, this.chart.options.elements.arc.hoverBackgroundColor), @@ -197,6 +194,7 @@ module.exports = function(Chart) { } }); + // Set correct angles if not resetting if (!reset) { if (index === 0) { @@ -206,12 +204,6 @@ module.exports = function(Chart) { } arc._model.endAngle = arc._model.startAngle + arc._model.circumference; - - - //Check to see if it's the last arc, if not get the next and update its start angle - if (index < this.getDataset().data.length - 1) { - this.getDataset().metaData[index + 1]._model.startAngle = arc._model.endAngle; - } } arc.pivot(); diff --git a/src/core/core.controller.js b/src/core/core.controller.js index fc5bbdedc..1c6a6f587 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -58,7 +58,6 @@ module.exports = function(Chart) { this.updateLayout(); this.resetElements(); this.initToolTip(); - this.draw(); this.update(); // TODO diff --git a/test/controller.doughnut.tests.js b/test/controller.doughnut.tests.js index 865d7b8cd..bed2da5aa 100644 --- a/test/controller.doughnut.tests.js +++ b/test/controller.doughnut.tests.js @@ -82,7 +82,7 @@ describe('Doughnut controller tests', function() { var controller = new Chart.controllers.doughnut(chart, 1); controller.reset(); // reset first - expect(chart.data.datasets[1].metaData[0]._model).toEqual({ + expect(chart.data.datasets[1].metaData[0]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: Math.PI * -0.5, @@ -90,9 +90,9 @@ describe('Doughnut controller tests', function() { circumference: 2.166614539857563, outerRadius: 49, innerRadius: 36.75 - }); + })); - expect(chart.data.datasets[1].metaData[1]._model).toEqual({ + expect(chart.data.datasets[1].metaData[1]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: Math.PI * -0.5, @@ -100,9 +100,9 @@ describe('Doughnut controller tests', function() { circumference: 3.2499218097863447, outerRadius: 49, innerRadius: 36.75 - }); + })); - expect(chart.data.datasets[1].metaData[2]._model).toEqual({ + expect(chart.data.datasets[1].metaData[2]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: Math.PI * -0.5, @@ -110,9 +110,9 @@ describe('Doughnut controller tests', function() { circumference: 0, outerRadius: 49, innerRadius: 36.75 - }); + })); - expect(chart.data.datasets[1].metaData[3]._model).toEqual({ + expect(chart.data.datasets[1].metaData[3]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: Math.PI * -0.5, @@ -120,11 +120,11 @@ describe('Doughnut controller tests', function() { circumference: 0.8666458159430251, outerRadius: 49, innerRadius: 36.75 - }); + })); controller.update(); - expect(chart.data.datasets[1].metaData[0]._model).toEqual({ + expect(chart.data.datasets[1].metaData[0]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: Math.PI * -0.5, @@ -139,9 +139,9 @@ describe('Doughnut controller tests', function() { hoverBackgroundColor: 'rgb(255, 255, 255)', label: 'label0', - }); + })); - expect(chart.data.datasets[1].metaData[1]._model).toEqual({ + expect(chart.data.datasets[1].metaData[1]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: 0.5958182130626666, @@ -156,9 +156,9 @@ describe('Doughnut controller tests', function() { hoverBackgroundColor: 'rgb(255, 255, 255)', label: 'label1' - }); + })); - expect(chart.data.datasets[1].metaData[2]._model).toEqual({ + expect(chart.data.datasets[1].metaData[2]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: 3.8457400228490113, @@ -173,9 +173,9 @@ describe('Doughnut controller tests', function() { hoverBackgroundColor: 'rgb(255, 255, 255)', label: 'label2' - }); + })); - expect(chart.data.datasets[1].metaData[3]._model).toEqual({ + expect(chart.data.datasets[1].metaData[3]._model).toEqual(jasmine.objectContaining({ x: 50, y: 100, startAngle: 3.8457400228490113, @@ -190,7 +190,7 @@ describe('Doughnut controller tests', function() { hoverBackgroundColor: 'rgb(255, 255, 255)', label: 'label3' - }); + })); // Change the amount of data and ensure that arcs are updated accordingly chart.data.datasets[1].data = [1, 2]; // remove 2 elements from dataset 0