diff --git a/docs/docs/getting-started/v3-migration.md b/docs/docs/getting-started/v3-migration.md index 907390b85d5..ffdd121f746 100644 --- a/docs/docs/getting-started/v3-migration.md +++ b/docs/docs/getting-started/v3-migration.md @@ -366,6 +366,8 @@ The following public APIs were removed. The following private APIs were removed. +* `Chart._bufferedRender` +* `Chart._updating` * `Chart.data.datasets[datasetIndex]._meta` * `DatasetController._getIndexScaleId` * `DatasetController._getIndexScale` @@ -457,6 +459,7 @@ The APIs listed in this section have changed in signature or behaviour from vers ##### Core Controller * The first parameter to `updateHoverStyle` is now an array of objects containing the `element`, `datasetIndex`, and `index` +* The signature or `resize` changed, the first `silent` parameter was removed. ##### Dataset Controllers @@ -492,3 +495,4 @@ All helpers are now exposed in a flat hierarchy, e.g., `Chart.helpers.canvas.cli * `afterDatasetsUpdate`, `afterUpdate`, `beforeDatasetsUpdate`, and `beforeUpdate` now receive `args` object as second argument. `options` argument is always the last and thus was moved from 2nd to 3rd place. * `afterEvent` and `beforeEvent` now receive a wrapped `event` as the second argument. The native event is available via `event.native`. +* Initial `resize` is no longer silent. Meaning that `resize` event can fire between `beforeInit` and `afterInit` diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 13d3f8d0fbb..f17aabb3afc 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -97,7 +97,6 @@ class Chart { this.height = height; this.aspectRatio = height ? width / height : null; this.options = config.options; - this._bufferedRender = false; this._layers = []; this._metasets = []; this.boxes = []; @@ -108,7 +107,6 @@ class Chart { /** @type {{attach?: function, detach?: function, resize?: function}} */ this._listeners = {}; this._sortedMetasets = []; - this._updating = false; this.scales = {}; this.scale = undefined; this._plugins = new PluginService(); @@ -157,8 +155,7 @@ class Chart { me._plugins.notify(me, 'beforeInit'); if (me.options.responsive) { - // Initial resize before chart draws (must be silent to preserve initial animations). - me.resize(true); + me.resize(); } else { retinaScale(me, me.options.devicePixelRatio); } @@ -193,7 +190,15 @@ class Chart { return this; } - resize(silent, width, height) { + resize(width, height) { + if (!animator.running(this)) { + this._resize(width, height); + } else { + this._resizeBeforeDraw = {width, height}; + } + } + + _resize(width, height) { const me = this; const options = me.options; const canvas = me.canvas; @@ -217,14 +222,12 @@ class Chart { retinaScale(me, newRatio); - if (!silent) { - me._plugins.notify(me, 'resize', [newSize]); + me._plugins.notify(me, 'resize', [newSize]); - callCallback(options.onResize, [newSize], me); + callCallback(options.onResize, [newSize], me); - if (me.attached) { - me.update('resize'); - } + if (me.attached) { + me.update('resize'); } } @@ -426,8 +429,6 @@ class Chart { const args = {mode}; let i, ilen; - me._updating = true; - each(me.scales, (scale) => { layouts.removeBox(me, scale); }); @@ -475,8 +476,6 @@ class Chart { } me.render(); - - me._updating = false; } /** @@ -569,7 +568,11 @@ class Chart { draw() { const me = this; let i; - + if (me._resizeBeforeDraw) { + const {width, height} = me._resizeBeforeDraw; + me._resize(width, height); + me._resizeBeforeDraw = null; + } me.clear(); if (me.width <= 0 || me.height <= 0) { @@ -848,7 +851,7 @@ class Chart { if (me.options.responsive) { listener = (width, height) => { if (me.canvas) { - me.resize(false, width, height); + me.resize(width, height); } }; diff --git a/test/specs/core.controller.tests.js b/test/specs/core.controller.tests.js index 6192f9bdf33..60a1a4b0ba2 100644 --- a/test/specs/core.controller.tests.js +++ b/test/specs/core.controller.tests.js @@ -1289,6 +1289,7 @@ describe('Chart', function() { var hooks = { init: [ 'beforeInit', + 'resize', 'afterInit' ], update: [ diff --git a/types/core/index.d.ts b/types/core/index.d.ts index 0b01d97609c..f8b88351bcd 100644 --- a/types/core/index.d.ts +++ b/types/core/index.d.ts @@ -277,7 +277,7 @@ export declare class Chart< clear(): this; stop(): this; - resize(silent: boolean, width: number, height: number): void; + resize(width: number, height: number): void; ensureScalesHaveIDs(): void; buildOrUpdateScales(): void; buildOrUpdateControllers(): void;