Fix pointRadius and pointHitRadius settings for radar charts

diff --git a/src/controllers/controller.radar.js b/src/controllers/controller.radar.js
index f0c04464a70485cff69e10424db9b9b5af0f8858..2f73b3cc1d2e658af0fe3ebdb0ea44f52a925514 100644 (file)
--- a/src/controllers/controller.radar.js
+++ b/src/controllers/controller.radar.js
@@ -79,6 +79,14 @@ module.exports = function(Chart) {
                        var pointElementOptions = me.chart.options.elements.point;
                        var pointPosition = scale.getPointPositionForValue(index, dataset.data[index]);
 
+                       // Compatibility: If the properties are defined with only the old name, use those values
+                       if ((dataset.radius !== undefined) && (dataset.pointRadius === undefined)) {
+                               dataset.pointRadius = dataset.radius;
+                       }
+                       if ((dataset.hitRadius !== undefined) && (dataset.pointHitRadius === undefined)) {
+                               dataset.pointHitRadius = dataset.hitRadius;
+                       }
+
                        helpers.extend(point, {
                                // Utility
                                _datasetIndex: me.index,
@@ -99,7 +107,7 @@ module.exports = function(Chart) {
                                        pointStyle: custom.pointStyle ? custom.pointStyle : helpers.getValueAtIndexOrDefault(dataset.pointStyle, index, pointElementOptions.pointStyle),
 
                                        // Tooltip
-                                       hitRadius: custom.hitRadius ? custom.hitRadius : helpers.getValueAtIndexOrDefault(dataset.hitRadius, index, pointElementOptions.hitRadius)
+                                       hitRadius: custom.hitRadius ? custom.hitRadius : helpers.getValueAtIndexOrDefault(dataset.pointHitRadius, index, pointElementOptions.hitRadius)
                                }
                        });
 
@@ -150,7 +158,7 @@ module.exports = function(Chart) {
                        var model = point._model;
                        var pointElementOptions = this.chart.options.elements.point;
 
-                       model.radius = custom.radius ? custom.radius : helpers.getValueAtIndexOrDefault(dataset.radius, index, pointElementOptions.radius);
+                       model.radius = custom.radius ? custom.radius : helpers.getValueAtIndexOrDefault(dataset.pointRadius, index, pointElementOptions.radius);
                        model.backgroundColor = custom.backgroundColor ? custom.backgroundColor : helpers.getValueAtIndexOrDefault(dataset.pointBackgroundColor, index, pointElementOptions.backgroundColor);
                        model.borderColor = custom.borderColor ? custom.borderColor : helpers.getValueAtIndexOrDefault(dataset.pointBorderColor, index, pointElementOptions.borderColor);
                        model.borderWidth = custom.borderWidth ? custom.borderWidth : helpers.getValueAtIndexOrDefault(dataset.pointBorderWidth, index, pointElementOptions.borderWidth);

diff --git a/test/specs/controller.radar.tests.js b/test/specs/controller.radar.tests.js
index 8f621c96bb488807d172d1e371b41c2e397b0a9d..38959a509786a4162964979e0609186c25321e5a 100644 (file)
--- a/test/specs/controller.radar.tests.js
+++ b/test/specs/controller.radar.tests.js
@@ -415,7 +415,7 @@ describe('Radar controller tests', function() {
                expect(point._model.radius).toBe(1.01);
 
                // Can set hover style per dataset
-               chart.data.datasets[0].radius = 3.3;
+               chart.data.datasets[0].pointRadius = 3.3;
                chart.data.datasets[0].pointBackgroundColor = 'rgb(77, 79, 81)';
                chart.data.datasets[0].pointBorderColor = 'rgb(123, 125, 127)';
                chart.data.datasets[0].pointBorderWidth = 2.1;
@@ -457,4 +457,26 @@ describe('Radar controller tests', function() {
                var point = meta.data[0];
                expect(point._model.borderWidth).toBe(0);
        });
+
+       it('should use the pointRadius setting over the radius setting', function() {
+               var chart = window.acquireChart({
+                       type: 'radar',
+                       data: {
+                               datasets: [{
+                                       data: [10, 15, 0, 4],
+                                       pointRadius: 10,
+                                       radius: 15,
+                               }, {
+                                       data: [20, 20, 20, 20],
+                                       radius: 20
+                               }],
+                               labels: ['label1', 'label2', 'label3', 'label4']
+                       }
+               });
+
+               var meta0 = chart.getDatasetMeta(0);
+               var meta1 = chart.getDatasetMeta(1);
+               expect(meta0.data[0]._model.radius).toBe(10);
+               expect(meta1.data[0]._model.radius).toBe(20);
+       });
 });