Fix pointRadius and pointHitRadius settings for radar charts

Author: etimberg

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);

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);
+	});
 });