Skip to content

Commit c457b50

Browse files
nagixsimonbrunel
nagix
authored and
simonbrunel
committed
Normalize angle for index in radialLinear scale (#6177)
1 parent 14007a9 commit c457b50

File tree

5 files changed

+95
-7
lines changed

5 files changed

+95
-7
lines changed

‎src/scales/scale.radialLinear.js‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -423,15 +423,14 @@ module.exports = LinearScaleBase.extend({
423423
},
424424

425425
getIndexAngle: function(index) {
426-
var angleMultiplier = (Math.PI * 2) / getValueCount(this);
427-
var startAngle = this.chart.options && this.chart.options.startAngle ?
428-
this.chart.options.startAngle :
429-
0;
430-
431-
var startAngleRadians = startAngle * Math.PI * 2 / 360;
426+
var angleMultiplier = 360 / getValueCount(this);
427+
var options = this.chart.options || {};
428+
var startAngle = options.startAngle || 0;
432429

433430
// Start from the top instead of right, so remove a quarter of the circle
434-
return index * angleMultiplier + startAngleRadians;
431+
var angle = (index * angleMultiplier + startAngle) % 360;
432+
433+
return (angle < 0 ? angle + 360 : angle) * Math.PI * 2 / 360;
435434
},
436435

437436
getDistanceFromCenterForValue: function(value) {

‎test/context.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ var Context = function() {
99
this._lineJoin = null;
1010
this._lineWidth = null;
1111
this._strokeStyle = null;
12+
this._textAlign = null;
1213

1314
// Define properties here so that we can record each time they are set
1415
Object.defineProperties(this, {
@@ -66,6 +67,15 @@ var Context = function() {
6667
this.record('setStrokeStyle', [style]);
6768
}
6869
},
70+
textAlign: {
71+
get: function() {
72+
return this._textAlign;
73+
},
74+
set: function(align) {
75+
this._textAlign = align;
76+
this.record('setTextAlign', [align]);
77+
}
78+
}
6979
});
7080
};
7181

‎test/specs/core.tooltip.tests.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1206,11 +1206,14 @@ describe('Core.Tooltip', function() {
12061206
tooltip.draw();
12071207

12081208
expect(mockContext.getCalls()).toEqual(Array.prototype.concat(drawBody, [
1209+
{name: 'setTextAlign', args: ['left']},
12091210
{name: 'setFillStyle', args: ['#fff']},
12101211
{name: 'fillText', args: ['title', 105, 105]},
1212+
{name: 'setTextAlign', args: ['left']},
12111213
{name: 'setFillStyle', args: ['#fff']},
12121214
{name: 'setFillStyle', args: ['#fff']},
12131215
{name: 'fillText', args: ['label', 105, 123]},
1216+
{name: 'setTextAlign', args: ['left']},
12141217
{name: 'setFillStyle', args: ['#fff']},
12151218
{name: 'fillText', args: ['footer', 105, 141]},
12161219
{name: 'restore', args: []}
@@ -1223,11 +1226,14 @@ describe('Core.Tooltip', function() {
12231226
tooltip.draw();
12241227

12251228
expect(mockContext.getCalls()).toEqual(Array.prototype.concat(drawBody, [
1229+
{name: 'setTextAlign', args: ['right']},
12261230
{name: 'setFillStyle', args: ['#fff']},
12271231
{name: 'fillText', args: ['title', 195, 105]},
1232+
{name: 'setTextAlign', args: ['right']},
12281233
{name: 'setFillStyle', args: ['#fff']},
12291234
{name: 'setFillStyle', args: ['#fff']},
12301235
{name: 'fillText', args: ['label', 195, 123]},
1236+
{name: 'setTextAlign', args: ['right']},
12311237
{name: 'setFillStyle', args: ['#fff']},
12321238
{name: 'fillText', args: ['footer', 195, 141]},
12331239
{name: 'restore', args: []}
@@ -1240,11 +1246,14 @@ describe('Core.Tooltip', function() {
12401246
tooltip.draw();
12411247

12421248
expect(mockContext.getCalls()).toEqual(Array.prototype.concat(drawBody, [
1249+
{name: 'setTextAlign', args: ['center']},
12431250
{name: 'setFillStyle', args: ['#fff']},
12441251
{name: 'fillText', args: ['title', 150, 105]},
1252+
{name: 'setTextAlign', args: ['center']},
12451253
{name: 'setFillStyle', args: ['#fff']},
12461254
{name: 'setFillStyle', args: ['#fff']},
12471255
{name: 'fillText', args: ['label', 150, 123]},
1256+
{name: 'setTextAlign', args: ['center']},
12481257
{name: 'setFillStyle', args: ['#fff']},
12491258
{name: 'fillText', args: ['footer', 150, 141]},
12501259
{name: 'restore', args: []}
@@ -1257,11 +1266,14 @@ describe('Core.Tooltip', function() {
12571266
tooltip.draw();
12581267

12591268
expect(mockContext.getCalls()).toEqual(Array.prototype.concat(drawBody, [
1269+
{name: 'setTextAlign', args: ['right']},
12601270
{name: 'setFillStyle', args: ['#fff']},
12611271
{name: 'fillText', args: ['title', 195, 105]},
1272+
{name: 'setTextAlign', args: ['center']},
12621273
{name: 'setFillStyle', args: ['#fff']},
12631274
{name: 'setFillStyle', args: ['#fff']},
12641275
{name: 'fillText', args: ['label', 150, 123]},
1276+
{name: 'setTextAlign', args: ['left']},
12651277
{name: 'setFillStyle', args: ['#fff']},
12661278
{name: 'fillText', args: ['footer', 105, 141]},
12671279
{name: 'restore', args: []}

‎test/specs/plugin.title.tests.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,9 @@ describe('Title block tests', function() {
134134
}, {
135135
name: 'rotate',
136136
args: [0]
137+
}, {
138+
name: 'setTextAlign',
139+
args: ['center'],
137140
}, {
138141
name: 'fillText',
139142
args: ['My title', 0, 0, 400]
@@ -184,6 +187,9 @@ describe('Title block tests', function() {
184187
}, {
185188
name: 'rotate',
186189
args: [-0.5 * Math.PI]
190+
}, {
191+
name: 'setTextAlign',
192+
args: ['center'],
187193
}, {
188194
name: 'fillText',
189195
args: ['My title', 0, 0, 400]
@@ -217,6 +223,9 @@ describe('Title block tests', function() {
217223
}, {
218224
name: 'rotate',
219225
args: [0.5 * Math.PI]
226+
}, {
227+
name: 'setTextAlign',
228+
args: ['center'],
220229
}, {
221230
name: 'fillText',
222231
args: ['My title', 0, 0, 400]

‎test/specs/scale.radialLinear.tests.js‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -485,4 +485,62 @@ describe('Test the radial linear scale', function() {
485485
expect(radToNearestDegree(chart.scale.getIndexAngle(x))).toBe((slice * x));
486486
}
487487
});
488+
489+
it('should correctly get the correct label alignment for all points', function() {
490+
var chart = window.acquireChart({
491+
type: 'radar',
492+
data: {
493+
datasets: [{
494+
data: [10, 5, 0, 25, 78]
495+
}],
496+
labels: ['label1', 'label2', 'label3', 'label4', 'label5']
497+
},
498+
options: {
499+
scale: {
500+
pointLabels: {
501+
callback: function(value, index) {
502+
return index.toString();
503+
}
504+
},
505+
ticks: {
506+
display: false
507+
}
508+
}
509+
}
510+
});
511+
512+
var scale = chart.scale;
513+
514+
[{
515+
startAngle: 30,
516+
textAlign: ['right', 'right', 'left', 'left', 'left'],
517+
y: [82, 366, 506, 319, 53]
518+
}, {
519+
startAngle: -30,
520+
textAlign: ['right', 'right', 'left', 'left', 'right'],
521+
y: [319, 506, 366, 82, 53]
522+
}, {
523+
startAngle: 750,
524+
textAlign: ['right', 'right', 'left', 'left', 'left'],
525+
y: [82, 366, 506, 319, 53]
526+
}].forEach(function(expected) {
527+
chart.options.startAngle = expected.startAngle;
528+
chart.update();
529+
530+
scale.ctx = window.createMockContext();
531+
chart.draw();
532+
533+
scale.ctx.getCalls().filter(function(x) {
534+
return x.name === 'setTextAlign';
535+
}).forEach(function(x, i) {
536+
expect(x.args[0]).toBe(expected.textAlign[i]);
537+
});
538+
539+
scale.ctx.getCalls().filter(function(x) {
540+
return x.name === 'fillText';
541+
}).map(function(x, i) {
542+
expect(x.args[2]).toBeCloseToPixel(expected.y[i]);
543+
});
544+
});
545+
});
488546
});

0 commit comments

Comments
 (0)