@visactor/vchart 1.7.5 → 1.8.0-beta.0

package/esm/core/vchart.js

@@ -94,9 +94,9 @@ import { Region } from "../region/region";
 
 import { Layout } from "../layout/base-layout";
 
-import { GroupMark } from "../mark/group";
+import { registerGroupMark } from "../mark/group";
 
-import { registerVGrammarAnimation } from "../animation/config";
+import { registerVGrammarCommonAnimation } from "../animation/config";
 
 import { View, registerFilterTransform, registerMapTransform } from "@visactor/vgrammar-core";
 
@@ -110,6 +110,8 @@ import { mergeTheme, preprocessTheme } from "../util/spec";
 
 import { darkTheme, registerTheme } from "../theme/builtin";
 
+import { ChartPluginService } from "../plugin/chart/plugin-service";
+
 export class VChart {
     static useRegisters(comps) {
         comps.forEach((fn => {
@@ -169,6 +171,12 @@ export class VChart {
     static getLogger() {
         return Logger.getInstance();
     }
+    getSpec() {
+        return this._spec;
+    }
+    getSpecInfo() {
+        return this._specInfo;
+    }
     getDataSet() {
         return this._dataSet;
     }
@@ -178,6 +186,9 @@ export class VChart {
             mode: RenderModeEnum["desktop-browser"],
             onError: msg => {
                 throw new Error(msg);
+            },
+            optimize: {
+                disableCheckGraphicWidthOutRange: !0
             }
         }, this._observer = null, this._context = {}, this._onResize = debounce(((...args) => {
             this._doResize();
@@ -188,7 +199,7 @@ export class VChart {
         isTrueBrowseEnv && dom && (this._container = isString(dom) ? null === document || void 0 === document ? void 0 : document.getElementById(dom) : dom), 
         renderCanvas && (this._canvas = renderCanvas), stage && (this._stage = stage), "node" === mode || this._container || this._canvas || this._stage ? (isTrueBrowseEnv ? registerBrowserEnv() : "node" === mode && registerNodeEnv(), 
         this._viewBox = this._option.viewBox, this._currentThemeName = ThemeManager.getCurrentThemeName(), 
-        this._setSpec(spec), this._updateCurrentTheme(), this._curSize = calculateChartSize(this._spec, {
+        this._setNewSpec(spec), this._updateCurrentTheme(), this._currentSize = calculateChartSize(this._spec, {
             container: this._container,
             canvas: this._canvas,
             mode: this._option.mode || RenderModeEnum["desktop-browser"],
@@ -203,22 +214,51 @@ export class VChart {
         }, restOptions), {
             background: this._getBackground(),
             onError: this._onError
-        })), this._compiler.setSize(this._curSize.width, this._curSize.height), this._eventDispatcher = new EventDispatcher(this, this._compiler), 
-        this._event = new Event(this._eventDispatcher, mode), this._compiler.initView(), 
-        null === (_d = this.getStage()) || void 0 === _d || _d.setTheme({
+        })), this._compiler.setSize(this._currentSize.width, this._currentSize.height), 
+        this._eventDispatcher = new EventDispatcher(this, this._compiler), this._event = new Event(this._eventDispatcher, mode), 
+        this._compiler.initView(), null === (_d = this.getStage()) || void 0 === _d || _d.setTheme({
             text: {
                 fontFamily: null === (_e = this._currentTheme) || void 0 === _e ? void 0 : _e.fontFamily
             }
         }), this._initDataSet(this._option.dataSet), this._autoSize = !!isTrueBrowseEnv && (null === (_g = null !== (_f = spec.autoFit) && void 0 !== _f ? _f : this._option.autoFit) || void 0 === _g || _g), 
-        this._bindResizeEvent(), this._bindVGrammarViewEvent(), InstanceManager.registerInstance(this)) : null === (_b = this._option) || void 0 === _b || _b.onError("please specify container or renderCanvas!");
+        this._bindResizeEvent(), this._bindVGrammarViewEvent(), this._initChartPlugin(), 
+        InstanceManager.registerInstance(this)) : null === (_b = this._option) || void 0 === _b || _b.onError("please specify container or renderCanvas!");
+    }
+    _setNewSpec(spec, forceMerge) {
+        return !!spec && (isString(spec) && (spec = JSON.parse(spec)), forceMerge && this._originalSpec && (spec = mergeSpec({}, this._originalSpec, spec)), 
+        this._originalSpec = spec, this._spec = this._getSpecFromOriginalSpec(), !0);
+    }
+    _getSpecFromOriginalSpec() {
+        var _a;
+        const spec = specTransform(this._originalSpec);
+        return spec.data = null !== (_a = spec.data) && void 0 !== _a ? _a : [], spec;
+    }
+    _initChartSpec(spec, actionSource) {
+        var _a;
+        VChart.getFunctionList() && VChart.getFunctionList().length && (spec = functionTransform(spec, VChart)), 
+        this._spec = spec, this._chartSpecTransformer || (this._chartSpecTransformer = Factory.createChartSpecTransformer(this._spec.type, {
+            type: this._spec.type,
+            getTheme: () => {
+                var _a;
+                return null !== (_a = this._currentTheme) && void 0 !== _a ? _a : {};
+            }
+        })), this._chartSpecTransformer.transformSpec(this._spec), this._chartPluginApply("onAfterChartSpecTransform", this._spec, actionSource), 
+        this._specInfo = null === (_a = this._chartSpecTransformer) || void 0 === _a ? void 0 : _a.transformModelSpec(this._spec), 
+        this._chartPluginApply("onAfterModelSpecTransform", this._spec, this._specInfo, actionSource);
     }
-    _setSpec(spec) {
-        spec && (this._spec = specTransform(isString(spec) ? JSON.parse(spec) : spec));
+    _updateSpecInfo() {
+        var _a;
+        this._chartSpecTransformer || (this._chartSpecTransformer = Factory.createChartSpecTransformer(this._spec.type, {
+            type: this._spec.type,
+            getTheme: () => {
+                var _a;
+                return null !== (_a = this._currentTheme) && void 0 !== _a ? _a : {};
+            }
+        })), this._specInfo = null === (_a = this._chartSpecTransformer) || void 0 === _a ? void 0 : _a.createSpecInfo(this._spec);
     }
     _initChart(spec) {
         var _a, _b;
         if (!this._compiler) return void (null === (_a = this._option) || void 0 === _a || _a.onError("compiler is not initialized"));
-        VChart.getFunctionList() && VChart.getFunctionList().length && (spec = functionTransform(spec, VChart));
         const chart = Factory.createChart(spec.type, spec, {
             type: spec.type,
             globalInstance: this,
@@ -237,10 +277,14 @@ export class VChart {
                 var _a;
                 return null !== (_a = this._currentTheme) && void 0 !== _a ? _a : {};
             },
+            getSpecInfo: () => {
+                var _a;
+                return null !== (_a = this._specInfo) && void 0 !== _a ? _a : {};
+            },
             layout: this._option.layout,
             onError: this._onError
         });
-        chart ? (this._chart = chart, this._chart.setCanvasRect(this._curSize.width, this._curSize.height), 
+        chart ? (this._chart = chart, this._chart.setCanvasRect(this._currentSize.width, this._currentSize.height), 
         this._chart.created(), this._chart.init(), this._event.emit(ChartEvent.initialized, {})) : null === (_b = this._option) || void 0 === _b || _b.onError("init chart fail");
     }
     _releaseData() {
@@ -267,7 +311,7 @@ export class VChart {
         this._autoSize && (window.removeEventListener("resize", this._onResize), this._observer && (this._observer.disconnect(), 
         this._observer = null));
     }
-    _getCurSize() {
+    getCurrentSize() {
         var _a, _b;
         const {width: containerWidth, height: containerHeight} = getContainerSize(this._container, DEFAULT_CHART_WIDTH, DEFAULT_CHART_HEIGHT);
         return {
@@ -276,8 +320,8 @@ export class VChart {
         };
     }
     _doResize() {
-        const {width: width, height: height} = this._getCurSize();
-        this._curSize.width === width && this._curSize.height === height || (this._curSize = {
+        const {width: width, height: height} = this.getCurrentSize();
+        this._currentSize.width === width && this._currentSize.height === height || (this._currentSize = {
             width: width,
             height: height
         }, this.resize(width, height));
@@ -289,23 +333,17 @@ export class VChart {
         for (const key in Factory.transforms) registerDataSetInstanceTransform(this._dataSet, key, Factory.transforms[key]);
         for (const key in Factory.dataParser) registerDataSetInstanceParser(this._dataSet, key, Factory.dataParser[key]);
     }
-    updateCustomConfigAndRerender(modifyConfig, morphConfig) {
-        return __awaiter(this, void 0, void 0, (function*() {
-            if (this._isReleased) return this;
-            const result = modifyConfig();
-            return isValid(result) ? (this._reCompile(result), yield this.renderAsync(morphConfig), 
-            this) : this;
-        }));
+    updateCustomConfigAndRerender(updateSpecResult, sync, option = {}) {
+        if (!this._isReleased && updateSpecResult) return isFunction(updateSpecResult) && (updateSpecResult = updateSpecResult()), 
+        this._reCompile(updateSpecResult), sync ? this._renderSync(option) : this._renderAsync(option);
     }
-    updateCustomConfigAndRerenderSync(modifyConfig, morphConfig) {
-        const result = modifyConfig();
-        return isValid(result) ? (this._reCompile(result), this.renderSync(morphConfig), 
-        this) : this;
+    _updateCustomConfigAndRecompile(updateSpecResult, option = {}) {
+        return !!updateSpecResult && (this._reCompile(updateSpecResult), this._beforeRender(option));
     }
     _reCompile(updateResult) {
         var _a, _b, _c, _d, _e, _f, _g;
-        if (updateResult.reMake) this._releaseData(), this._initDataSet(), this._chart.release(), 
-        this._chart = null, null === (_a = this._compiler) || void 0 === _a || _a.releaseGrammar(!1 === (null === (_b = this._option) || void 0 === _b ? void 0 : _b.animation) || !1 === (null === (_c = this._spec) || void 0 === _c ? void 0 : _c.animation)), 
+        if (updateResult.reMake) this._releaseData(), this._initDataSet(), this._chartSpecTransformer = null, 
+        this._chart.release(), this._chart = null, null === (_a = this._compiler) || void 0 === _a || _a.releaseGrammar(!1 === (null === (_b = this._option) || void 0 === _b ? void 0 : _b.animation) || !1 === (null === (_c = this._spec) || void 0 === _c ? void 0 : _c.animation)), 
         this._userEvents.forEach((e => {
             var _a;
             return null === (_a = this._event) || void 0 === _a ? void 0 : _a.on(e.eType, e.query, e.handler);
@@ -316,67 +354,79 @@ export class VChart {
             chart: this._chart,
             vChart: this
         }, {})), updateResult.reSize) {
-            const {width: width, height: height} = this._getCurSize();
-            this._chart.onResize(width, height), null === (_g = (_f = this._compiler).resize) || void 0 === _g || _g.call(_f, width, height, !1);
+            const {width: width, height: height} = this.getCurrentSize();
+            this._chart.onResize(width, height, !1), null === (_g = (_f = this._compiler).resize) || void 0 === _g || _g.call(_f, width, height, !1);
         }
     }
+    _beforeRender(option = {}) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        if (this._isReleased) return !1;
+        if (this._chart) return !0;
+        const {transformSpec: transformSpec, actionSource: actionSource} = option;
+        return transformSpec && this._initChartSpec(this._spec, "render"), this._chartPluginApply("onBeforeInitChart", this._spec, actionSource), 
+        null === (_b = null === (_a = this._option.performanceHook) || void 0 === _a ? void 0 : _a.beforeInitializeChart) || void 0 === _b || _b.call(_a), 
+        this._initChart(this._spec), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterInitializeChart) || void 0 === _d || _d.call(_c), 
+        !(!this._chart || !this._compiler) && (null === (_f = null === (_e = this._option.performanceHook) || void 0 === _e ? void 0 : _e.beforeCompileToVGrammar) || void 0 === _f || _f.call(_e), 
+        this._compiler.compile({
+            chart: this._chart,
+            vChart: this
+        }, {
+            performanceHook: this._option.performanceHook
+        }), null === (_h = null === (_g = this._option.performanceHook) || void 0 === _g ? void 0 : _g.afterCompileToVGrammar) || void 0 === _h || _h.call(_g), 
+        !0);
+    }
+    _afterRender() {
+        return !this._isReleased && (this._updateAnimateState(), this._event.emit(ChartEvent.rendered, {}), 
+        !0);
+    }
     renderSync(morphConfig) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        if (!this._chart) {
-            if (null === (_b = null === (_a = this._option.performanceHook) || void 0 === _a ? void 0 : _a.beforeInitializeChart) || void 0 === _b || _b.call(_a), 
-            this._initChart(this._spec), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterInitializeChart) || void 0 === _d || _d.call(_c), 
-            !this._chart || !this._compiler) return this;
-            null === (_f = null === (_e = this._option.performanceHook) || void 0 === _e ? void 0 : _e.beforeCompileToVGrammar) || void 0 === _f || _f.call(_e), 
-            this._compiler.compile({
-                chart: this._chart,
-                vChart: this
-            }, {
-                performanceHook: this._option.performanceHook
-            }), null === (_h = null === (_g = this._option.performanceHook) || void 0 === _g ? void 0 : _g.afterCompileToVGrammar) || void 0 === _h || _h.call(_g);
-        }
-        return null === (_j = this._compiler) || void 0 === _j || _j.renderSync(morphConfig), 
-        this._option.animation && (null === (_k = this._chart) || void 0 === _k || _k.getAllRegions().forEach((region => {
-            var _a;
-            null === (_a = region.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
-        })), null === (_l = this._chart) || void 0 === _l || _l.getAllComponents().forEach((component => {
-            var _a;
-            null === (_a = component.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
-        }))), this._event.emit(ChartEvent.rendered, {}), this;
+        return this._renderSync({
+            morphConfig: morphConfig,
+            transformSpec: !0,
+            actionSource: "render"
+        });
     }
     renderAsync(morphConfig) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         return __awaiter(this, void 0, void 0, (function*() {
-            if (this._isReleased) return this;
-            if (!this._chart) {
-                if (null === (_b = null === (_a = this._option.performanceHook) || void 0 === _a ? void 0 : _a.beforeInitializeChart) || void 0 === _b || _b.call(_a), 
-                this._initChart(this._spec), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterInitializeChart) || void 0 === _d || _d.call(_c), 
-                !this._chart || !this._compiler) return this;
-                null === (_f = null === (_e = this._option.performanceHook) || void 0 === _e ? void 0 : _e.beforeCompileToVGrammar) || void 0 === _f || _f.call(_e), 
-                this._compiler.compile({
-                    chart: this._chart,
-                    vChart: this
-                }, {
-                    performanceHook: this._option.performanceHook
-                }), null === (_h = null === (_g = this._option.performanceHook) || void 0 === _g ? void 0 : _g.afterCompileToVGrammar) || void 0 === _h || _h.call(_g);
-            }
-            return yield null === (_j = this._compiler) || void 0 === _j ? void 0 : _j.renderAsync(morphConfig), 
-            this._isReleased || (this._option.animation && (null === (_k = this._chart) || void 0 === _k || _k.getAllRegions().forEach((region => {
-                var _a;
-                null === (_a = region.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
-            })), null === (_l = this._chart) || void 0 === _l || _l.getAllComponents().forEach((component => {
-                var _a;
-                null === (_a = component.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
-            }))), this._event.emit(ChartEvent.rendered, {})), this;
+            return this._renderAsync({
+                morphConfig: morphConfig,
+                transformSpec: !0,
+                actionSource: "render"
+            });
+        }));
+    }
+    _renderSync(option = {}) {
+        var _a;
+        const self = this;
+        return this._beforeRender(option) ? (null === (_a = this._compiler) || void 0 === _a || _a.renderSync(option.morphConfig), 
+        this._afterRender(), self) : self;
+    }
+    _renderAsync(option = {}) {
+        var _a;
+        return __awaiter(this, void 0, void 0, (function*() {
+            const self = this;
+            return this._beforeRender(option) ? (yield null === (_a = this._compiler) || void 0 === _a ? void 0 : _a.renderAsync(option.morphConfig), 
+            this._afterRender(), self) : self;
         }));
     }
+    _updateAnimateState() {
+        var _a, _b;
+        this._option.animation && (null === (_a = this._chart) || void 0 === _a || _a.getAllRegions().forEach((region => {
+            var _a;
+            null === (_a = region.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
+        })), null === (_b = this._chart) || void 0 === _b || _b.getAllComponents().forEach((component => {
+            var _a;
+            null === (_a = component.animate) || void 0 === _a || _a.updateAnimateState(AnimationStateEnum.update, !0);
+        })));
+    }
     release() {
         var _a, _b, _c, _d;
         (null === (_a = this._onResize) || void 0 === _a ? void 0 : _a.cancel) && this._onResize.cancel(), 
-        null === (_b = this._chart) || void 0 === _b || _b.release(), null === (_c = this._compiler) || void 0 === _c || _c.release(), 
-        null === (_d = this._eventDispatcher) || void 0 === _d || _d.release(), this._unBindResizeEvent(), 
-        this._releaseData(), this._chart = null, this._compiler = null, this._spec = null, 
-        this._userEvents = null, this._event = null, this._eventDispatcher = null, this._isReleased = !0, 
-        InstanceManager.unregisterInstance(this);
+        this._chartPluginApply("disposeAll"), this._chartSpecTransformer = null, null === (_b = this._chart) || void 0 === _b || _b.release(), 
+        null === (_c = this._compiler) || void 0 === _c || _c.release(), null === (_d = this._eventDispatcher) || void 0 === _d || _d.release(), 
+        this._unBindResizeEvent(), this._releaseData(), this._chart = null, this._compiler = null, 
+        this._spec = null, this._originalSpec = null, this._userEvents = null, this._event = null, 
+        this._eventDispatcher = null, this._isReleased = !0, InstanceManager.unregisterInstance(this);
     }
     updateData(id, data, options) {
         return __awaiter(this, void 0, void 0, (function*() {
@@ -454,41 +504,41 @@ export class VChart {
     }
     updateSpec(spec, forceMerge = !1, morphConfig) {
         return __awaiter(this, void 0, void 0, (function*() {
-            return spec ? (isString(spec) && (spec = JSON.parse(spec)), forceMerge && (spec = mergeSpec({}, this._spec, spec)), 
-            yield this.updateCustomConfigAndRerender((() => {
-                var _a, _b, _c;
-                spec = specTransform(spec);
-                const lastSpec = this._spec;
-                this._spec = spec, isEqual(lastSpec.theme, spec.theme) || (this._updateCurrentTheme(), 
-                null === (_a = this._chart) || void 0 === _a || _a.setCurrentTheme());
-                const reSize = this._shouldChartResize(lastSpec);
-                return null === (_c = null === (_b = this._compiler) || void 0 === _b ? void 0 : _b.getVGrammarView()) || void 0 === _c || _c.updateLayoutTag(), 
-                mergeUpdateResult(this._chart.updateSpec(spec), {
-                    change: reSize,
-                    reMake: !1,
-                    reCompile: !1,
-                    reSize: reSize
-                });
-            }), morphConfig), this) : this;
+            const result = this._updateSpec(spec, forceMerge);
+            return yield this.updateCustomConfigAndRerender(result, !1, {
+                morphConfig: morphConfig,
+                transformSpec: !0,
+                actionSource: "updateSpec"
+            }), this;
         }));
     }
     updateSpecSync(spec, forceMerge = !1, morphConfig) {
-        return spec ? (isString(spec) && (spec = JSON.parse(spec)), forceMerge && (spec = mergeSpec({}, this._spec, spec)), 
-        this.updateCustomConfigAndRerenderSync((() => {
-            var _a, _b, _c, _d;
-            (spec = specTransform(spec)).data = null !== (_a = spec.data) && void 0 !== _a ? _a : [];
-            const lastSpec = this._spec;
-            this._spec = spec, isEqual(lastSpec.theme, spec.theme) || (this._updateCurrentTheme(), 
-            null === (_b = this._chart) || void 0 === _b || _b.setCurrentTheme());
-            const reSize = this._shouldChartResize(lastSpec);
-            return null === (_d = null === (_c = this._compiler) || void 0 === _c ? void 0 : _c.getVGrammarView()) || void 0 === _d || _d.updateLayoutTag(), 
-            mergeUpdateResult(this._chart.updateSpec(spec), {
-                change: reSize,
-                reMake: !1,
-                reCompile: !1,
-                reSize: reSize
-            });
-        }), morphConfig), this) : this;
+        const result = this._updateSpec(spec, forceMerge);
+        return this.updateCustomConfigAndRerender(result, !0, {
+            morphConfig: morphConfig,
+            transformSpec: !0,
+            actionSource: "updateSpec"
+        }), this;
+    }
+    updateSpecAndRecompile(spec, forceMerge = !1, option = {}) {
+        const result = this._updateSpec(spec, forceMerge);
+        return this._updateCustomConfigAndRecompile(result, Object.assign({
+            actionSource: "updateSpecAndRecompile"
+        }, option));
+    }
+    _updateSpec(spec, forceMerge = !1) {
+        var _a, _b;
+        const lastSpec = this._spec;
+        if (!this._setNewSpec(spec, forceMerge)) return;
+        isEqual(lastSpec.theme, this._spec.theme) || this._setCurrentTheme();
+        const reSize = this._shouldChartResize(lastSpec);
+        return null === (_b = null === (_a = this._compiler) || void 0 === _a ? void 0 : _a.getVGrammarView()) || void 0 === _b || _b.updateLayoutTag(), 
+        mergeUpdateResult(this._chart.updateSpec(this._spec), {
+            change: reSize,
+            reMake: !1,
+            reCompile: !1,
+            reSize: reSize
+        });
     }
     updateModelSpec(filter, spec, forceMerge = !1, morphConfig) {
         return __awaiter(this, void 0, void 0, (function*() {
@@ -512,20 +562,22 @@ export class VChart {
     }
     _updateModelSpec(model, spec, sync = !1, forceMerge = !1, morphConfig) {
         forceMerge && (spec = mergeSpec({}, model.getSpec(), spec));
-        const modifyConfig = () => {
-            const result = model.updateSpec(spec);
-            return model.reInit(), (result.change || result.reCompile || result.reMake || result.reSize || result.reRender) && this._chart.reDataFlow(), 
-            result;
-        };
-        return sync ? this.updateCustomConfigAndRerenderSync(modifyConfig, morphConfig) : this.updateCustomConfigAndRerender(modifyConfig, morphConfig);
+        const result = model.updateSpec(spec);
+        return model.reInit(spec), (result.change || result.reCompile || result.reMake || result.reSize || result.reRender) && this._chart.reDataFlow(), 
+        this.updateCustomConfigAndRerender(result, sync, {
+            morphConfig: morphConfig,
+            transformSpec: !1,
+            actionSource: "updateModelSpec"
+        });
     }
     resize(width, height) {
         var _a, _b, _c, _d, _e, _f;
         return __awaiter(this, void 0, void 0, (function*() {
             if (!this._chart || !this._compiler) return this;
             const chartCanvasRect = this._chart.getCanvasRect();
-            return chartCanvasRect && chartCanvasRect.width === width && chartCanvasRect.height === height ? this : (null === (_b = null === (_a = this._option.performanceHook) || void 0 === _a ? void 0 : _a.beforeResizeWithUpdate) || void 0 === _b || _b.call(_a), 
-            this._chart.onResize(width, height), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterResizeWithUpdate) || void 0 === _d || _d.call(_c), 
+            return chartCanvasRect && chartCanvasRect.width === width && chartCanvasRect.height === height ? this : (this._chartPluginApply("onBeforeResize", width, height), 
+            null === (_b = null === (_a = this._option.performanceHook) || void 0 === _a ? void 0 : _a.beforeResizeWithUpdate) || void 0 === _b || _b.call(_a), 
+            this._chart.onResize(width, height, !1), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterResizeWithUpdate) || void 0 === _d || _d.call(_c), 
             yield null === (_f = (_e = this._compiler).resize) || void 0 === _f ? void 0 : _f.call(_e, width, height), 
             this._isReleased || this._event.emit(ChartEvent.afterResize, {
                 chart: this._chart
@@ -596,25 +648,29 @@ export class VChart {
     }
     setCurrentTheme(name) {
         return __awaiter(this, void 0, void 0, (function*() {
-            return ThemeManager.themeExist(name) ? (yield this.updateCustomConfigAndRerender((() => {
-                var _a;
-                return this._updateCurrentTheme(name), null === (_a = this._chart) || void 0 === _a || _a.setCurrentTheme(), 
-                {
-                    change: !0,
-                    reMake: !1
-                };
-            })), this) : this;
+            if (!ThemeManager.themeExist(name)) return this;
+            const result = this._setCurrentTheme(name);
+            return yield this.updateCustomConfigAndRerender(result, !1, {
+                transformSpec: !1,
+                actionSource: "setCurrentTheme"
+            }), this;
         }));
     }
     setCurrentThemeSync(name) {
-        return ThemeManager.themeExist(name) ? (this.updateCustomConfigAndRerenderSync((() => {
-            var _a;
-            return this._updateCurrentTheme(name), null === (_a = this._chart) || void 0 === _a || _a.setCurrentTheme(), 
-            {
-                change: !0,
-                reMake: !1
-            };
-        })), this) : this;
+        if (!ThemeManager.themeExist(name)) return this;
+        const result = this._setCurrentTheme(name);
+        return this.updateCustomConfigAndRerender(result, !0, {
+            transformSpec: !1,
+            actionSource: "setCurrentTheme"
+        }), this;
+    }
+    _setCurrentTheme(name) {
+        var _a;
+        return this._updateCurrentTheme(name), this._initChartSpec(this._getSpecFromOriginalSpec(), "setCurrentTheme"), 
+        null === (_a = this._chart) || void 0 === _a || _a.setCurrentTheme(), {
+            change: !0,
+            reMake: !1
+        };
     }
     _getTooltipComponent() {
         var _a;
@@ -811,6 +867,17 @@ export class VChart {
     getFunctionList() {
         return ExpressionFunction.instance().getFunctionNameList();
     }
+    setRuntimeSpec(spec) {
+        this._spec = spec, this._updateSpecInfo();
+    }
+    _initChartPlugin() {
+        const pluginList = Factory.getChartPlugins();
+        pluginList.length > 0 && (this._chartPlugin = new ChartPluginService(this), this._chartPlugin.load(pluginList.map((p => new p))), 
+        this._chartPluginApply("onInit", this._spec));
+    }
+    _chartPluginApply(funcName, ...args) {
+        this._chartPlugin && this._chartPlugin[funcName] && this._chartPlugin[funcName].apply(this._chartPlugin, args);
+    }
 }
 
 VChart.InstanceManager = InstanceManager, VChart.ThemeManager = ThemeManager, VChart.globalConfig = {
@@ -819,11 +886,11 @@ VChart.InstanceManager = InstanceManager, VChart.ThemeManager = ThemeManager, VC
 
 export const registerVChartCore = () => {
     Factory.registerRegion("region", Region), Factory.registerLayout("base", Layout), 
-    Factory.registerMark(GroupMark.type, GroupMark), View.useRegisters([ registerFilterTransform, registerMapTransform ]), 
-    registerVGrammarAnimation(), registerTheme(darkTheme.name, darkTheme), Logger.getInstance(LoggerLevel.Error);
+    registerGroupMark(), View.useRegisters([ registerFilterTransform, registerMapTransform ]), 
+    registerVGrammarCommonAnimation(), registerTheme(darkTheme.name, darkTheme), Logger.getInstance(LoggerLevel.Error);
 };
 
 Factory.registerRegion("region", Region), Factory.registerLayout("base", Layout), 
-Factory.registerMark(GroupMark.type, GroupMark), View.useRegisters([ registerFilterTransform, registerMapTransform ]), 
-registerVGrammarAnimation(), registerTheme(darkTheme.name, darkTheme), Logger.getInstance(LoggerLevel.Error);
+registerGroupMark(), View.useRegisters([ registerFilterTransform, registerMapTransform ]), 
+registerVGrammarCommonAnimation(), registerTheme(darkTheme.name, darkTheme), Logger.getInstance(LoggerLevel.Error);
 //# sourceMappingURL=vchart.js.map