Radial Linear Scale: Compute Value based on distance from center (#7449)

* Radial Linear Scale: Compute Value based on distance from center

* Code review updates
This commit is contained in:
Evert Timberg 2020-06-01 08:07:48 -04:00 committed by GitHub
parent e38cc257fb
commit 7872c8490e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 43 additions and 0 deletions

View File

@ -422,6 +422,16 @@ class RadialLinearScale extends LinearScaleBase {
return (value - me.min) * scalingFactor;
}
getValueForDistanceFromCenter(distance) {
if (isNullOrUndef(distance)) {
return NaN;
}
const me = this;
const scaledDistance = distance / (me.drawingArea / (me.max - me.min));
return me.options.reverse ? me.max - scaledDistance : me.min + scaledDistance;
}
getPointPosition(index, distanceFromCenter) {
const me = this;
const angle = me.getIndexAngle(index) - (Math.PI / 2);

View File

@ -453,6 +453,39 @@ describe('Test the radial linear scale', function() {
expect(chart.scales.r.getDistanceFromCenterForValue(chart.scales.r.max)).toBe(0);
});
it('should get the correct value for a distance from the center point', function() {
var chart = window.acquireChart({
type: 'radar',
data: {
datasets: [{
data: [10, 5, 0, 25, 78]
}],
labels: ['label1', 'label2', 'label3', 'label4', 'label5']
},
options: {
scale: {
pointLabels: {
callback: function(value, index) {
return index.toString();
}
}
}
}
});
expect(chart.scales.r.getValueForDistanceFromCenter(0)).toBe(chart.scales.r.min);
expect(chart.scales.r.getValueForDistanceFromCenter(227)).toBe(chart.scales.r.max);
var dist = chart.scales.r.getDistanceFromCenterForValue(5);
expect(chart.scales.r.getValueForDistanceFromCenter(dist)).toBe(5);
chart.scales.r.options.reverse = true;
chart.update();
expect(chart.scales.r.getValueForDistanceFromCenter(0)).toBe(chart.scales.r.max);
expect(chart.scales.r.getValueForDistanceFromCenter(227)).toBe(chart.scales.r.min);
});
it('should correctly get angles for all points', function() {
var chart = window.acquireChart({
type: 'radar',