From d43f772ad8032995da1adecf1b89ed0e497291c2 Mon Sep 17 00:00:00 2001 From: Simon Brunel Date: Sat, 11 Feb 2017 16:02:15 +0100 Subject: [PATCH] Add chart data property setter and unit tests Chart data can now be entirely replaced using `chart.data = {...}` thanks to the new property setter (instead of using `chart.config.data = {}`). Also update the documentation, as suggested by @ldaguise and @kennethkalmer, with a note about versions prior 2.6. --- docs/09-Advanced.md | 4 +++- src/core/core.controller.js | 4 ++++ test/controller.bar.tests.js | 4 ++-- test/core.controller.tests.js | 19 +++++++++++++++++++ test/core.tooltip.tests.js | 4 ++-- 5 files changed, 30 insertions(+), 5 deletions(-) diff --git a/docs/09-Advanced.md b/docs/09-Advanced.md index bdf02e7044b..9d1f2834137 100644 --- a/docs/09-Advanced.md +++ b/docs/09-Advanced.md @@ -25,7 +25,7 @@ myLineChart.destroy(); #### .update(duration, lazy) -Triggers an update of the chart. This can be safely called after replacing the entire data object. This will update all scales, legends, and then re-render the chart. +Triggers an update of the chart. This can be safely called after updating the data object. This will update all scales, legends, and then re-render the chart. ```javascript // duration is the time for the animation of the redraw in milliseconds @@ -34,6 +34,8 @@ myLineChart.data.datasets[0].data[2] = 50; // Would update the first dataset's v myLineChart.update(); // Calling update now animates the position of March from 90 to 50. ``` +> **Note:** replacing the data reference (e.g. `myLineChart.data = {datasets: [...]}` only works starting **version 2.6**. Prior that, replacing the entire data object could be achieved with the following workaround: `myLineChart.config.data = {datasets: [...]}`. + #### .reset() Reset the chart to it's state before the initial animation. A new animation can then be triggered using `update`. diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 0d4c128bad7..2ecb425fb63 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -94,9 +94,13 @@ module.exports = function(Chart) { // Add the chart instance to the global namespace Chart.instances[me.id] = me; + // Define alias to the config data: `chart.data === chart.config.data` Object.defineProperty(me, 'data', { get: function() { return me.config.data; + }, + set: function(value) { + me.config.data = value; } }); diff --git a/test/controller.bar.tests.js b/test/controller.bar.tests.js index 38f1b733a1a..c533ddb0161 100644 --- a/test/controller.bar.tests.js +++ b/test/controller.bar.tests.js @@ -738,8 +738,8 @@ describe('Bar controller tests', function() { expect(meta.data[i]._model.base).toBeCloseToPixel(484); expect(meta.data[i]._model.width).toBeCloseToPixel(40); expect(meta.data[i]._model).toEqual(jasmine.objectContaining({ - datasetLabel: chart.config.data.datasets[1].label, - label: chart.config.data.labels[i], + datasetLabel: chart.data.datasets[1].label, + label: chart.data.labels[i], backgroundColor: 'red', borderSkipped: 'top', borderColor: 'blue', diff --git a/test/core.controller.tests.js b/test/core.controller.tests.js index f29542cbf59..c72ebe9c26b 100644 --- a/test/core.controller.tests.js +++ b/test/core.controller.tests.js @@ -57,6 +57,25 @@ describe('Chart', function() { expect(chart.data.datasets[1].data).toBe(ds1.data); }); + it('should define chart.data as an alias for config.data', function() { + var config = {data: {labels: [], datasets: []}}; + var chart = acquireChart(config); + + expect(chart.data).toBe(config.data); + + chart.data = {labels: [1, 2, 3], datasets: [{data: [4, 5, 6]}]}; + + expect(config.data).toBe(chart.data); + expect(config.data.labels).toEqual([1, 2, 3]); + expect(config.data.datasets[0].data).toEqual([4, 5, 6]); + + config.data = {labels: [7, 8, 9], datasets: [{data: [10, 11, 12]}]}; + + expect(chart.data).toBe(config.data); + expect(chart.data.labels).toEqual([7, 8, 9]); + expect(chart.data.datasets[0].data).toEqual([10, 11, 12]); + }); + it('should initialize config with default options', function() { var callback = function() {}; diff --git a/test/core.tooltip.tests.js b/test/core.tooltip.tests.js index e6e3960779f..93cfb3bea36 100755 --- a/test/core.tooltip.tests.js +++ b/test/core.tooltip.tests.js @@ -692,10 +692,10 @@ describe('Core.Tooltip', function() { expect(tooltip._view.dataPoints[0].index).toEqual(pointIndex); expect(tooltip._view.dataPoints[0].datasetIndex).toEqual(datasetIndex); expect(tooltip._view.dataPoints[0].xLabel).toEqual( - chart.config.data.labels[pointIndex] + chart.data.labels[pointIndex] ); expect(tooltip._view.dataPoints[0].yLabel).toEqual( - chart.config.data.datasets[datasetIndex].data[pointIndex] + chart.data.datasets[datasetIndex].data[pointIndex] ); expect(tooltip._view.dataPoints[0].x).toBeCloseToPixel(point._model.x); expect(tooltip._view.dataPoints[0].y).toBeCloseToPixel(point._model.y);