workaround instead of breaking change, add regression test

chartjs · Mar 2, 2019 · e5dcf5d · e5dcf5d
1 parent fb5c00b
commit e5dcf5d
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 16 deletions.
diff --git a/docs/charts/polar.md b/docs/charts/polar.md
@@ -94,7 +94,7 @@ These are the customisation options specific to Polar Area charts. These options
 
 | Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
-| `startAngle` | `number` | `0` | Starting angle to draw arcs for the first item in a dataset. In degrees, 0 is at top.
+| `startAngle` | `number` | `-0.5 * Math.PI` | Starting angle to draw arcs for the first item in a dataset.
 | `animation.animateRotate` | `boolean` | `true` | If true, the chart will animate in with a rotation animation. This property is in the `options.animation` object.
 | `animation.animateScale` | `boolean` | `true` | If true, will animate scaling the chart from the center outwards.
 

diff --git a/src/controllers/controller.polarArea.js b/src/controllers/controller.polarArea.js
@@ -30,7 +30,7 @@ defaults._set('polarArea', {
 		animateScale: true
 	},
 
-	startAngle: 0,
+	startAngle: -0.5 * Math.PI,
 	legendCallback: function(chart) {
 		var text = [];
 		text.push('<ul class="' + chart.id + '-legend">');
@@ -110,12 +110,6 @@ defaults._set('polarArea', {
 	}
 });
 
-function getStartAngleRadians(deg) {
-	// radianLinear scale draws angleLines using startAngle. 0 is excepted to be at top.
-	// Here we adjust to standard unit circle used in drawing, where 0 is at right.
-	return helpers.toRadians(deg) - 0.5 * Math.PI;
-}
-
 module.exports = DatasetController.extend({
 
 	dataElementType: elements.Arc,
@@ -126,7 +120,7 @@ module.exports = DatasetController.extend({
 		var me = this;
 		var dataset = me.getDataset();
 		var meta = me.getMeta();
-		var start = getStartAngleRadians(me.chart.options.startAngle || 0);
+		var start = me.chart.options.startAngle || 0;
 		var starts = me._starts = [];
 		var angles = me._angles = [];
 		var arcs = meta.data;
@@ -179,7 +173,7 @@ module.exports = DatasetController.extend({
 		var centerX = scale.xCenter;
 		var centerY = scale.yCenter;
 
-		var datasetStartAngle = getStartAngleRadians(opts.startAngle);
+		var datasetStartAngle = opts.startAngle;
 		var distance = arc.hidden ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
 		var startAngle = me._starts[index];
 		var endAngle = startAngle + (arc.hidden ? 0 : me._angles[index]);

diff --git a/src/scales/scale.radialLinear.js b/src/scales/scale.radialLinear.js
@@ -423,12 +423,17 @@ module.exports = LinearScaleBase.extend({
 	},
 
 	getIndexAngle: function(index) {
-		var angleMultiplier = (Math.PI * 2) / getValueCount(this);
-		var startAngle = this.chart.options && this.chart.options.startAngle ?
-			this.chart.options.startAngle :
-			0;
+		var me = this;
+		var angleMultiplier = (Math.PI * 2) / getValueCount(me);
+		var startAngle = me.chart.options && me.chart.options.startAngle
+			? me.chart.options.startAngle
+			: 0;
+
+		var startAngleRadians = (me.chart.config.type === 'polarArea')
+			? startAngle + Math.PI * 0.5
+			: helpers.toRadians(startAngle);
 
-		return index * angleMultiplier + helpers.toRadians(startAngle);
+		return index * angleMultiplier + startAngleRadians;
 	},
 
 	getDistanceFromCenterForValue: function(value) {

diff --git a/test/fixtures/controller.polarArea/angle-lines.json b/test/fixtures/controller.polarArea/angle-lines.json
@@ -0,0 +1,35 @@
+{
+	"threshold": 0.05,
+    "config": {
+        "type": "polarArea",
+        "data": {
+            "labels": ["A", "B", "C", "D", "E"],
+            "datasets": [{
+                "data": [11, 16, 21, 7, 10],
+                "backgroundColor": [
+                    "rgba(255, 99, 132, 0.8)",
+                    "rgba(54, 162, 235, 0.8)",
+                    "rgba(255, 206, 86, 0.8)",
+                    "rgba(75, 192, 192, 0.8)",
+                    "rgba(153, 102, 255, 0.8)",
+                    "rgba(255, 159, 64, 0.8)"
+                ]
+            }]
+		},
+        "options": {
+            "responsive": false,
+            "legend": false,
+            "title": false,
+            "scale": {
+				"display": true,
+				"angleLines": {
+					"display": true,
+					"color": "#000"
+				},
+				"ticks": {
+					"display": false
+				}
+            }
+        }
+    }
+}
diff --git a/test/fixtures/controller.polarArea/angle-lines.png b/test/fixtures/controller.polarArea/angle-lines.png
diff --git a/test/specs/controller.polarArea.tests.js b/test/specs/controller.polarArea.tests.js
@@ -172,7 +172,7 @@ describe('Chart.controllers.polarArea', function() {
 				showLines: true,
 				legend: false,
 				title: false,
-				startAngle: 90, // default is 0
+				startAngle: 0, // default is -0.5 * Math.PI
 				elements: {
 					arc: {
 						backgroundColor: 'rgb(255, 0, 0)',