From: Evert Timberg <evert.timberg+github@gmail.com>
Date: Sun, 21 Jan 2018 21:47:04 +0000 (-0500)
Subject: Tooltip label callback example (#5168)
X-Git-Tag: v2.7.2~1^2~14
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=d668882971166ac11768ab659b2d5770642c33b3;p=thirdparty%2FChart.js.git

Tooltip label callback example (#5168)
---

diff --git a/docs/configuration/tooltip.md b/docs/configuration/tooltip.md
index 1be2c26bc..9990fc916 100644
--- a/docs/configuration/tooltip.md
+++ b/docs/configuration/tooltip.md
@@ -103,6 +103,32 @@ All functions are called with the same arguments: a [tooltip item](#tooltip-item
 | `footer` | `Array[tooltipItem], data` | Returns text to render as the footer of the tooltip.
 | `afterFooter` | `Array[tooltipItem], data` | Text to render after the footer section
 
+### Label Callback
+
+The label callback can change the text that displays for a given data point. A common example to round data values; the following example rounds the data to two decimal places.
+
+```javascript
+var chart = new Chart(ctx, {
+    type: 'line',
+    data: data,
+    options: {
+        tooltips: {
+            callbacks: {
+                label: function(tooltipItem, data) {
+                    var label = data.datasets[tooltipItem.datasetIndex].label || '';
+
+                    if (label) {
+                        label += ': ';
+                    }
+                    label += Math.round(tooltipItem.yLabel * 100) / 100;
+                    return label;
+                }
+            }
+        }
+    }
+});
+```
+
 ### Label Color Callback
 
 For example, to return a red box for each item in the tooltip you could do: