mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 12:19:08 +02:00
Merge pull request #2947 from chartjs/fix/524
Add polar area start angle setting
This commit is contained in:
commit
e94d3c0730
@ -76,6 +76,7 @@ These are the customisation options specific to Polar Area charts. These options
|
||||
|
||||
Name | Type | Default | Description
|
||||
--- | --- | --- | ---
|
||||
startAngle | Number | -0.5 * Math.PI | Sets the starting angle for the first item in a dataset
|
||||
scale | Object | [See Scales](#scales) and [Defaults for Radial Linear Scale](#scales-radial-linear-scale) | Options for the one scale used on the chart. Use this to style the ticks, labels, and grid.
|
||||
*scale*.type | String |"radialLinear" | As defined in ["Radial Linear"](#scales-radial-linear-scale).
|
||||
*scale*.lineArc | Boolean | true | When true, lines are circular.
|
||||
|
@ -20,6 +20,7 @@ module.exports = function(Chart) {
|
||||
animateScale: true
|
||||
},
|
||||
|
||||
startAngle: -0.5 * Math.PI,
|
||||
aspectRatio: 1,
|
||||
legendCallback: function(chart) {
|
||||
var text = [];
|
||||
@ -154,9 +155,10 @@ module.exports = function(Chart) {
|
||||
}
|
||||
}
|
||||
|
||||
var negHalfPI = -0.5 * Math.PI;
|
||||
//var negHalfPI = -0.5 * Math.PI;
|
||||
var datasetStartAngle = opts.startAngle;
|
||||
var distance = arc.hidden ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
|
||||
var startAngle = (negHalfPI) + (circumference * visibleCount);
|
||||
var startAngle = datasetStartAngle + (circumference * visibleCount);
|
||||
var endAngle = startAngle + (arc.hidden ? 0 : circumference);
|
||||
|
||||
var resetRadius = animationOpts.animateScale ? 0 : scale.getDistanceFromCenterForValue(dataset.data[index]);
|
||||
@ -173,8 +175,8 @@ module.exports = function(Chart) {
|
||||
y: centerY,
|
||||
innerRadius: 0,
|
||||
outerRadius: reset ? resetRadius : distance,
|
||||
startAngle: reset && animationOpts.animateRotate ? negHalfPI : startAngle,
|
||||
endAngle: reset && animationOpts.animateRotate ? negHalfPI : endAngle,
|
||||
startAngle: reset && animationOpts.animateRotate ? datasetStartAngle : startAngle,
|
||||
endAngle: reset && animationOpts.animateRotate ? datasetStartAngle : endAngle,
|
||||
label: getValueAtIndexOrDefault(labels, index, labels[index])
|
||||
}
|
||||
});
|
||||
|
@ -159,6 +159,52 @@ describe('Polar area controller tests', function() {
|
||||
}));
|
||||
});
|
||||
|
||||
it('should update elements with start angle from options', function() {
|
||||
var chart = window.acquireChart({
|
||||
type: 'polarArea',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [10, 15, 0, -4],
|
||||
label: 'dataset2'
|
||||
}],
|
||||
labels: ['label1', 'label2', 'label3', 'label4']
|
||||
},
|
||||
options: {
|
||||
showLines: true,
|
||||
startAngle: 0, // default is -0.5 * Math.PI
|
||||
elements: {
|
||||
arc: {
|
||||
backgroundColor: 'rgb(255, 0, 0)',
|
||||
borderColor: 'rgb(0, 255, 0)',
|
||||
borderWidth: 1.2
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var meta = chart.getDatasetMeta(0);
|
||||
expect(meta.data.length).toBe(4);
|
||||
|
||||
[ { o: 156, s: 0, e: 0.5 * Math.PI },
|
||||
{ o: 211, s: 0.5 * Math.PI, e: Math.PI },
|
||||
{ o: 45, s: Math.PI, e: 1.5 * Math.PI },
|
||||
{ o: 0, s: 1.5 * Math.PI, e: 2.0 * Math.PI }
|
||||
].forEach(function(expected, i) {
|
||||
expect(meta.data[i]._model.x).toBeCloseToPixel(256);
|
||||
expect(meta.data[i]._model.y).toBeCloseToPixel(272);
|
||||
expect(meta.data[i]._model.innerRadius).toBeCloseToPixel(0);
|
||||
expect(meta.data[i]._model.outerRadius).toBeCloseToPixel(expected.o);
|
||||
expect(meta.data[i]._model.startAngle).toBe(expected.s);
|
||||
expect(meta.data[i]._model.endAngle).toBe(expected.e);
|
||||
expect(meta.data[i]._model).toEqual(jasmine.objectContaining({
|
||||
backgroundColor: 'rgb(255, 0, 0)',
|
||||
borderColor: 'rgb(0, 255, 0)',
|
||||
borderWidth: 1.2,
|
||||
label: chart.data.labels[i]
|
||||
}));
|
||||
});
|
||||
});
|
||||
|
||||
it('should handle number of data point changes in update', function() {
|
||||
var chart = window.acquireChart({
|
||||
type: 'polarArea',
|
||||
|
Loading…
Reference in New Issue
Block a user