Add raw data to context and rename dataPoint to parsed (#8318)

* Make the raw data point available in scriptable context
* Rename variables
* Update samples

diff --git a/docs/docs/configuration/tooltip.md b/docs/docs/configuration/tooltip.md
index 2b907e967b91f3770726059ef2c2bada2aa3af2b..1b978644ca491fa62cde1d3cf251d8f2fa7ab79a 100644 (file)
--- a/docs/docs/configuration/tooltip.md
+++ b/docs/docs/configuration/tooltip.md
@@ -140,8 +140,8 @@ var chart = new Chart(ctx, {
                         if (label) {
                             label += ': ';
                         }
-                        if (!isNaN(context.dataPoint.y)) {
-                            label += new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(context.dataPoint.y);
+                        if (!isNaN(context.parsed.y)) {
+                            label += new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(context.parsed.y);
                         }
                         return label;
                     }
@@ -220,7 +220,10 @@ The tooltip items passed to the tooltip callbacks implement the following interf
     label: string,
 
     // Parsed data values for the given `dataIndex` and `datasetIndex`
-    dataPoint: object,
+    parsed: object,
+
+    // Raw data values for the given `dataIndex` and `datasetIndex`
+    raw: object,
 
     // Formatted value for the tooltip
     formattedValue: string,

diff --git a/docs/docs/general/options.md b/docs/docs/general/options.md
index 695f1ba3e4bfd7a066c58ac241d2f1acc4281ac7..d0e54ac5e93f58b951ee5b1a36b5b6c6ee7bfbab 100644 (file)
--- a/docs/docs/general/options.md
+++ b/docs/docs/general/options.md
@@ -72,7 +72,8 @@ In addition to [dataset](#dataset)
 
 - `active`: true if element is active (hovered)
 - `dataIndex`: index of the current data
-- `dataPoint`: the parsed data values for the given `dataIndex` and `datasetIndex`
+- `parsed`: the parsed data values for the given `dataIndex` and `datasetIndex`
+- `raw`: the raw data values for the given `dataIndex` and `datasetIndex`
 - `element`: the element (point, arc, bar, etc.) for this data
 - `index`: getter for `dataIndex`
 - `type`: `'data'`

diff --git a/samples/animations/delay.html b/samples/animations/delay.html
index aa52cbdf0c642341da5b63bf07c8fef1be879df7..66b37a1236f046687f049f28a25b779d82de627f 100644 (file)
--- a/samples/animations/delay.html
+++ b/samples/animations/delay.html
@@ -76,7 +76,7 @@
                                                var delay = 0;
                                                var dsIndex = context.datasetIndex;
                                                var index = context.dataIndex;
-                                               if (context.dataPoint && !context.delayed) {
+                                               if (context.parsed && !context.delayed) {
                                                        delay = index * 300 + dsIndex * 100;
                                                        context.delayed = true;
                                                }

diff --git a/samples/charts/multi-series-pie.html b/samples/charts/multi-series-pie.html
index 6f193a008800bd8851e4678f9888aa100bcd0610..c4952b112786e94590fffbc67081ad76d91c1e9c 100644 (file)
--- a/samples/charts/multi-series-pie.html
+++ b/samples/charts/multi-series-pie.html
@@ -84,7 +84,7 @@
                                                callbacks: {
                                                        label: function(context) {
                                                                var labelIndex = (context.datasetIndex * 2) + context.dataIndex;
-                                                               return context.chart.data.labels[labelIndex] + ': ' + context.dataset.data[context.dataIndex];
+                                                               return context.chart.data.labels[labelIndex] + ': ' + context.formattedValue;
                                                        }
                                                }
                                        }

diff --git a/samples/scales/financial.html b/samples/scales/financial.html
index 6e006e90c86357aaafa458f4f6b9493eb86e21ca..7afc97ae8c5709ea6c432222a67f32d4dd94491b 100644 (file)
--- a/samples/scales/financial.html
+++ b/samples/scales/financial.html
@@ -192,7 +192,7 @@
                                                                if (label) {
                                                                        label += ': ';
                                                                }
-                                                               label += context.dataPoint.y.toFixed(2);
+                                                               label += context.parsed.y.toFixed(2);
                                                                return label;
                                                        }
                                                }

diff --git a/samples/scriptable/bar.html b/samples/scriptable/bar.html
index 53e8efcd871706092c9cd2afb745de6ee585cb20..3fb69796253237a5ec1afa99f36f2e6bc74cce7f 100644 (file)
--- a/samples/scriptable/bar.html
+++ b/samples/scriptable/bar.html
@@ -27,7 +27,7 @@
                utils.srand(110);
 
                function colorize(opaque, ctx) {
-                       var v = ctx.dataPoint.y;
+                       var v = ctx.parsed.y;
                        var c = v < -50 ? '#D60000'
                                : v < 0 ? '#F46300'
                                : v < 50 ? '#0358B6'

diff --git a/samples/scriptable/bubble.html b/samples/scriptable/bubble.html
index bf4fca4022e74e26ba0ddb92ab3a84f4222e8364..addc37c19c91fb4e35254d60ef8317de090d2efd 100644 (file)
--- a/samples/scriptable/bubble.html
+++ b/samples/scriptable/bubble.html
@@ -33,7 +33,7 @@
                }
 
                function colorize(opaque, context) {
-                       var value = context.dataset.data[context.dataIndex];
+                       var value = context.raw;
                        var x = value.x / 100;
                        var y = value.y / 100;
                        var r = channelValue(x, y, [250, 150, 50, 0]);
@@ -90,14 +90,12 @@
                                        },
 
                                        hoverBorderWidth: function(context) {
-                                               var value = context.dataset.data[context.dataIndex];
-                                               return Math.round(8 * value.v / 1000);
+                                               return Math.round(8 * context.raw.v / 1000);
                                        },
 
                                        radius: function(context) {
-                                               var value = context.dataset.data[context.dataIndex];
                                                var size = context.chart.width;
-                                               var base = Math.abs(value.v) / 1000;
+                                               var base = Math.abs(context.raw.v) / 1000;
                                                return (size / 24) * base;
                                        }
                                }

diff --git a/samples/scriptable/line.html b/samples/scriptable/line.html
index 7a69e4b467ec5cad141a1fb0697969b9c0e0248b..ae367d08ed432cc5997d68cbc30a890b52891c3a 100644 (file)
--- a/samples/scriptable/line.html
+++ b/samples/scriptable/line.html
@@ -40,7 +40,7 @@
                }
 
                function adjustRadiusBasedOnData(ctx) {
-                       var v = ctx.dataPoint.y;
+                       var v = ctx.parsed.y;
                        return v < 10 ? 5
                                : v < 25 ? 7
                                : v < 50 ? 9

diff --git a/samples/scriptable/pie.html b/samples/scriptable/pie.html
index bd77ebc6c5754ed88a8ba591470aaf465f0d48d4..2b5b26c619bc99f9b4545442848ff2aa054ff49e 100644 (file)
--- a/samples/scriptable/pie.html
+++ b/samples/scriptable/pie.html
@@ -27,7 +27,7 @@
                utils.srand(110);
 
                function colorize(opaque, hover, ctx) {
-                       var v = ctx.dataPoint;
+                       var v = ctx.parsed;
                        var c = v < -50 ? '#D60000'
                                : v < 0 ? '#F46300'
                                : v < 50 ? '#0358B6'

diff --git a/samples/scriptable/polar.html b/samples/scriptable/polar.html
index 4b348b0e65ddb6b7aef663210abf2d9140d4dbe8..0a5238674de856991f00e6c74a5b2ee7962c3480 100644 (file)
--- a/samples/scriptable/polar.html
+++ b/samples/scriptable/polar.html
@@ -26,7 +26,7 @@
                utils.srand(110);
 
                function colorize(opaque, hover, ctx) {
-                       var v = ctx.dataset.data[ctx.dataIndex];
+                       var v = ctx.raw;
                        var c = v < 35 ? '#D60000'
                                : v < 55 ? '#F46300'
                                : v < 75 ? '#0358B6'

diff --git a/samples/scriptable/radar.html b/samples/scriptable/radar.html
index 984955c5ef014d3e83833d2562f2cd387bdcd068..00286996c7ad06bce4344d0729a79b7e77b7df45 100644 (file)
--- a/samples/scriptable/radar.html
+++ b/samples/scriptable/radar.html
@@ -44,7 +44,7 @@
                }
 
                function adjustRadiusBasedOnData(ctx) {
-                       var v = ctx.dataPoint.y;
+                       var v = ctx.parsed.y;
                        return v < 10 ? 5
                                : v < 25 ? 7
                                : v < 50 ? 9

diff --git a/samples/tooltips/callbacks.html b/samples/tooltips/callbacks.html
index 7d5b7702da7a8e7c135a77468e66186e81d02e7f..406d06d3d43088423cd90d72d5c3cfe220413836 100644 (file)
--- a/samples/tooltips/callbacks.html
+++ b/samples/tooltips/callbacks.html
@@ -68,7 +68,7 @@
                                                                var sum = 0;
 
                                                                tooltipItems.forEach(function(tooltipItem) {
-                                                                       sum += tooltipItem.dataPoint.y;
+                                                                       sum += tooltipItem.parsed.y;
                                                                });
                                                                return 'Sum: ' + sum;
                                                        },

diff --git a/src/core/core.datasetController.js b/src/core/core.datasetController.js
index 1485935b5f15035da6cf27ca9b9f0de03206636f..dd27ef163d06b513f552aadb7af050a84baed702 100644 (file)
--- a/src/core/core.datasetController.js
+++ b/src/core/core.datasetController.js
@@ -171,7 +171,7 @@ function createDatasetContext(parent, index, dataset) {
        });
 }
 
-function createDataContext(parent, index, point, element) {
+function createDataContext(parent, index, point, raw, element) {
        return Object.create(parent, {
                active: {
                        writable: true,
@@ -180,9 +180,12 @@ function createDataContext(parent, index, point, element) {
                dataIndex: {
                        value: index
                },
-               dataPoint: {
+               parsed: {
                        value: point
                },
+               raw: {
+                       value: raw
+               },
                element: {
                        value: element
                },
@@ -757,13 +760,14 @@ export default class DatasetController {
         */
        getContext(index, active) {
                const me = this;
+               const dataset = me.getDataset();
                let context;
                if (index >= 0 && index < me._cachedMeta.data.length) {
                        const element = me._cachedMeta.data[index];
                        context = element.$context ||
-                               (element.$context = createDataContext(me.getContext(), index, me.getParsed(index), element));
+                               (element.$context = createDataContext(me.getContext(), index, me.getParsed(index), dataset.data[index], element));
                } else {
-                       context = me.$context || (me.$context = createDatasetContext(me.chart.getContext(), me.index, me.getDataset()));
+                       context = me.$context || (me.$context = createDatasetContext(me.chart.getContext(), me.index, dataset));
                }
 
                context.active = !!active;

diff --git a/src/plugins/plugin.tooltip.js b/src/plugins/plugin.tooltip.js
index c43cca711ba2fc995a8f60bbf1bac9bde360f316..cb230dd5c5ee693577e08d030e4931f072b26705 100644 (file)
--- a/src/plugins/plugin.tooltip.js
+++ b/src/plugins/plugin.tooltip.js
@@ -122,7 +122,8 @@ function createTooltipItem(chart, item) {
        return {
                chart,
                label,
-               dataPoint: controller.getParsed(index),
+               parsed: controller.getParsed(index),
+               raw: chart.data.datasets[datasetIndex].data[index],
                formattedValue: value,
                dataset: controller.getDataset(),
                dataIndex: index,

diff --git a/test/specs/plugin.tooltip.tests.js b/test/specs/plugin.tooltip.tests.js
index e07eae70f66cdc62218612df29e08259af8ca170..fabb34d3874d716e9769694c2fc9617a76f34d92 100644 (file)
--- a/test/specs/plugin.tooltip.tests.js
+++ b/test/specs/plugin.tooltip.tests.js
@@ -506,7 +506,7 @@ describe('Plugin.Tooltip', function() {
                                                mode: 'index',
                                                callbacks: {
                                                        beforeLabel: function(ctx) {
-                                                               return ctx.dataPoint.x + ',' + ctx.dataPoint.y;
+                                                               return ctx.parsed.x + ',' + ctx.parsed.y;
                                                        }
                                                }
                                        }