Polar area: startAngle in degrees, 0 at top.

chartjs · Jan 5, 2019 · a18471b · a18471b
1 parent 87e44fa
commit a18471b
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 10 deletions.
diff --git a/docs/charts/polar.md b/docs/charts/polar.md
@@ -68,7 +68,7 @@ These are the customisation options specific to Polar Area charts. These options
 
 | Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
-| `startAngle` | `Number` | `-0.5 * Math.PI` | Starting angle to draw arcs for the first item in a dataset.
+| `startAngle` | `Number` | `0` | Starting angle to draw arcs for the first item in a dataset. In degrees, 0 is top.
 | `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
@@ -28,7 +28,7 @@ defaults._set('polarArea', {
 		animateScale: true
 	},
 
-	startAngle: -0.5 * Math.PI,
+	startAngle: 0,
 	legendCallback: function(chart) {
 		var text = [];
 		text.push('<ul class="' + chart.id + '-legend">');
@@ -119,14 +119,15 @@ module.exports = DatasetController.extend({
 		var me = this;
 		var dataset = me.getDataset();
 		var meta = me.getMeta();
-		var start = me.chart.options.startAngle || 0;
+		var start = helpers.toRadians(me.chart.options.startAngle || 0);
 		var starts = me._starts = [];
 		var angles = me._angles = [];
 		var i, ilen, angle;
 
 		me._updateRadius();
 
 		meta.count = me.countVisibleElements();
+		start -= Math.PI / 2.0; // radialLinear scale expects 0 to be at top
 
 		for (i = 0, ilen = dataset.data.length; i < ilen; i++) {
 			starts[i] = start;
@@ -170,8 +171,8 @@ module.exports = DatasetController.extend({
 		var centerX = scale.xCenter;
 		var centerY = scale.yCenter;
 
-		// var negHalfPI = -0.5 * Math.PI;
-		var datasetStartAngle = opts.startAngle;
+		var negHalfPI = -0.5 * Math.PI;
+		var datasetStartAngle = helpers.toRadians(opts.startAngle) + negHalfPI;
 		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
@@ -424,10 +424,7 @@ module.exports = LinearScaleBase.extend({
 			this.chart.options.startAngle :
 			0;
 
-		var startAngleRadians = startAngle * Math.PI * 2 / 360;
-
-		// Start from the top instead of right, so remove a quarter of the circle
-		return index * angleMultiplier + startAngleRadians;
+		return index * angleMultiplier + helpers.toRadians(startAngle);
 	},
 
 	getDistanceFromCenterForValue: function(value) {

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: 0, // default is -0.5 * Math.PI
+				startAngle: 90, // default is 0
 				elements: {
 					arc: {
 						backgroundColor: 'rgb(255, 0, 0)',