Allow spanning data gaps for radar charts

docs/axes/radial/linear.md

@@ -104,7 +104,7 @@ The following options are used to configure the point labels that are shown on t
 | Name | Type | Default | Description
 | -----| ---- | --------| -----------
 | `callback` | `Function` | | Callback function to transform data labels to point labels. The default implementation simply returns the current string.
-| `fontColor` | `Color` | `'#666'` | Font color for point labels.
+| `fontColor` | ``Color/Color[]`` | `'#666'` | Font color for point labels.
 | `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family to use when rendering labels.
 | `fontSize` | `Number` | 10 | font size in pixels
 | `fontStyle` | `String` | `'normal'` | Font style to use when rendering point labels.

docs/charts/radar.md

@@ -88,6 +88,7 @@ All point* properties can be specified as an array. If these are set to an array
 | `pointHoverBorderColor` | `Color/Color[]` | Point border color when hovered.
 | `pointHoverBorderWidth` | `Number/Number[]` | Border width of point when hovered.
 | `pointHoverRadius` | `Number/Number[]` | The radius of the point when hovered.
+| `spanGaps` | `Boolean` | If true, lines will be drawn between points with no or null data. If false, points with `NaN` data will create a break in the line
 
 ### pointStyle
 The style of point. Options are:

src/controllers/controller.radar.js

@@ -30,6 +30,7 @@ module.exports = function(Chart) {
 			var meta = me.getMeta();
 			var line = meta.dataset;
 			var points = meta.data;
+			var options = me.chart.options;
 			var custom = line.custom || {};
 			var dataset = me.getDataset();
 			var lineElementOptions = me.chart.options.elements.line;
@@ -50,6 +51,8 @@ module.exports = function(Chart) {
 				// Model
 				_model: {
 					// Appearance
+					// This option gives lines the ability to span gaps
+					spanGaps: dataset.spanGaps ? dataset.spanGaps : options.spanGaps,
 					tension: custom.tension ? custom.tension : helpers.valueOrDefault(dataset.lineTension, lineElementOptions.tension),
 					backgroundColor: custom.backgroundColor ? custom.backgroundColor : (dataset.backgroundColor || lineElementOptions.backgroundColor),
 					borderWidth: custom.borderWidth ? custom.borderWidth : (dataset.borderWidth || lineElementOptions.borderWidth),

src/scales/scale.radialLinear.js

@@ -268,8 +268,11 @@ module.exports = function(Chart) {
 
 				// Keep this in loop since we may support array properties here
 				var pointLabelFontColor = valueOrDefault(pointLabelOpts.fontColor, globalDefaults.defaultFontColor);
+				var pointLabelFontColorFormatted = helpers.isArray(pointLabelFontColor) ?
+					pointLabelFontColor[i] : pointLabelFontColor;
+
 				ctx.font = plFont.font;
-				ctx.fillStyle = pointLabelFontColor;
+				ctx.fillStyle = pointLabelFontColorFormatted;
 
 				var angleRadians = scale.getIndexAngle(i);
 				var angle = helpers.toDegrees(angleRadians);