From: Ben McCann <322311+benmccann@users.noreply.github.com> Date: Fri, 5 Feb 2021 14:13:32 +0000 (-0800) Subject: Add raw data to context and rename dataPoint to parsed (#8318) X-Git-Tag: v3.0.0-beta.11~44 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=eb7ce4e5a00eb938762009eab450f7cdad11f71c;p=thirdparty%2FChart.js.git 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 2b907e967..1b978644c 100644 --- 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 695f1ba3e..d0e54ac5e 100644 --- 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 aa52cbdf0..66b37a123 100644 --- 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 6f193a008..c4952b112 100644 --- 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 6e006e90c..7afc97ae8 100644 --- 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 53e8efcd8..3fb697962 100644 --- 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 bf4fca402..addc37c19 100644 --- 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 7a69e4b46..ae367d08e 100644 --- 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 bd77ebc6c..2b5b26c61 100644 --- 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 4b348b0e6..0a5238674 100644 --- 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 984955c5e..00286996c 100644 --- 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 7d5b7702d..406d06d3d 100644 --- 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 1485935b5..dd27ef163 100644 --- 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 c43cca711..cb230dd5c 100644 --- 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 e07eae70f..fabb34d38 100644 --- 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; } } }