From: ApoorvA <ascoolas.apoorva@gmail.com>
Date: Sun, 28 May 2017 12:39:29 +0000 (+0530)
Subject: Add tooltip textLabelColor callback (#4199)
X-Git-Tag: v2.7.0~1^2~105
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=394382b931789a0861a5a7daf153faa5a4498af2;p=thirdparty%2FChart.js.git

Add tooltip textLabelColor callback (#4199)

Add a new tooltip callback `labelTextColor` that returns the colour for each item in the body of the tooltip.

Fixes issue #4191
---

diff --git a/docs/configuration/tooltip.md b/docs/configuration/tooltip.md
index 21387f140..8947d2463 100644
--- a/docs/configuration/tooltip.md
+++ b/docs/configuration/tooltip.md
@@ -74,6 +74,7 @@ All functions are called with the same arguments: a [tooltip item](#chart-config
 | `beforeLabel` | `tooltipItem, data` | Returns text to render before an individual label. This will be called for each item in the tooltip.
 | `label` | `tooltipItem, data` | Returns text to render for an individual item in the tooltip.
 | `labelColor` | `tooltipItem, chart` | Returns the colors to render for the tooltip item. [more...](#label-color-callback)
+| `labelTextColor` | `tooltipItem, chart` | Returns the colors for the text of the label for the tooltip item.
 | `afterLabel` | `tooltipItem, data` | Returns text to render after an individual label.
 | `afterBody` | `Array[tooltipItem], data` | Returns text to render after the body section
 | `beforeFooter` | `Array[tooltipItem], data` | Returns text to render before the footer section.
@@ -95,6 +96,9 @@ var chart = new Chart(ctx, {
                         borderColor: 'rgb(255, 0, 0)',
                         backgroundColor: 'rgb(255, 0, 0)'
                     }
+                },
+                labelTextColor:function(tooltipItem, chart){
+                    return '#543453';
                 }
             }
         }
diff --git a/src/core/core.tooltip.js b/src/core/core.tooltip.js
index 3428f4ac9..cb21a9bc9 100644
--- a/src/core/core.tooltip.js
+++ b/src/core/core.tooltip.js
@@ -87,6 +87,9 @@ module.exports = function(Chart) {
 					backgroundColor: view.backgroundColor
 				};
 			},
+			labelTextColor: function() {
+				return this._options.bodyFontColor;
+			},
 			afterLabel: helpers.noop,
 
 			// Args are: (tooltipItems, data)
@@ -487,6 +490,7 @@ module.exports = function(Chart) {
 				model.opacity = 1;
 
 				var labelColors = [];
+				var labelTextColors = [];
 				tooltipPosition = Chart.Tooltip.positioners[opts.position](active, me._eventPosition);
 
 				var tooltipItems = [];
@@ -511,8 +515,10 @@ module.exports = function(Chart) {
 				// Determine colors for boxes
 				helpers.each(tooltipItems, function(tooltipItem) {
 					labelColors.push(opts.callbacks.labelColor.call(me, tooltipItem, me._chart));
+					labelTextColors.push(opts.callbacks.labelTextColor.call(me, tooltipItem, me._chart));
 				});
 
+
 				// Build the Text Lines
 				model.title = me.getTitle(tooltipItems, data);
 				model.beforeBody = me.getBeforeBody(tooltipItems, data);
@@ -525,6 +531,7 @@ module.exports = function(Chart) {
 				model.y = Math.round(tooltipPosition.y);
 				model.caretPadding = opts.caretPadding;
 				model.labelColors = labelColors;
+				model.labelTextColors = labelTextColors;
 
 				// data points
 				model.dataPoints = tooltipItems;
@@ -657,9 +664,6 @@ module.exports = function(Chart) {
 
 			ctx.textAlign = vm._bodyAlign;
 			ctx.textBaseline = 'top';
-
-			var textColor = mergeOpacity(vm.bodyFontColor, opacity);
-			ctx.fillStyle = textColor;
 			ctx.font = helpers.fontString(bodyFontSize, vm._bodyFontStyle, vm._bodyFontFamily);
 
 			// Before Body
@@ -693,7 +697,7 @@ module.exports = function(Chart) {
 						// Inner square
 						ctx.fillStyle = mergeOpacity(vm.labelColors[i].backgroundColor, opacity);
 						ctx.fillRect(pt.x + 1, pt.y + 1, bodyFontSize - 2, bodyFontSize - 2);
-
+						var textColor = mergeOpacity(vm.labelTextColors[i], opacity);
 						ctx.fillStyle = textColor;
 					}
 
diff --git a/test/specs/core.tooltip.tests.js b/test/specs/core.tooltip.tests.js
index 886e43a2f..0fbc46799 100755
--- a/test/specs/core.tooltip.tests.js
+++ b/test/specs/core.tooltip.tests.js
@@ -330,6 +330,7 @@ describe('Core.Tooltip', function() {
 			afterBody: [],
 			footer: [],
 			caretPadding: 2,
+			labelTextColors: ['#fff'],
 			labelColors: [{
 				borderColor: 'rgb(255, 0, 0)',
 				backgroundColor: 'rgb(0, 255, 0)'
@@ -393,6 +394,9 @@ describe('Core.Tooltip', function() {
 						},
 						afterFooter: function() {
 							return 'afterFooter';
+						},
+						labelTextColor: function() {
+							return 'labelTextColor';
 						}
 					}
 				}
@@ -476,6 +480,7 @@ describe('Core.Tooltip', function() {
 			afterBody: ['afterBody'],
 			footer: ['beforeFooter', 'footer', 'afterFooter'],
 			caretPadding: 2,
+			labelTextColors: ['labelTextColor', 'labelTextColor'],
 			labelColors: [{
 				borderColor: 'rgb(255, 0, 0)',
 				backgroundColor: 'rgb(0, 255, 0)'