@visactor/vchart 2.0.1-alpha.3 → 2.0.1-alpha.4

package/build/index.es.js

@@ -50243,6 +50243,9 @@ class Compiler {
         this._container = container;
         this._option = option;
     }
+    getChart() {
+        return this._compileChart;
+    }
     getCanvas() {
         var _a;
         return (_a = this._stage) === null || _a === void 0 ? void 0 : _a.window.getNativeHandler().nativeCanvas;
@@ -53280,26 +53283,39 @@ class BaseMark extends GrammarItem {
     }
     setAnimationConfig(config) {
         const defaultPrams = this.type === 'group' ? { selfOnly: true } : {};
+        const formatAnimationCfg = (cfg) => {
+            var _a;
+            const options = (_a = cfg.options) !== null && _a !== void 0 ? _a : {};
+            return Object.assign(Object.assign(Object.assign({}, defaultPrams), cfg), { options: (datum, graphic, customParams) => {
+                    var _a, _b;
+                    const _options = typeof options === 'function' ? options(datum, graphic, customParams) : options;
+                    if (graphic && graphic.context && graphic.context.compiler && isValid$1(graphic.context.modelId)) {
+                        const model = (_a = graphic.context.compiler.getChart()) === null || _a === void 0 ? void 0 : _a.getModelById(graphic.context.modelId);
+                        return Object.assign(Object.assign({}, _options), { layoutRect: (_b = model === null || model === void 0 ? void 0 : model.getLayoutRect) === null || _b === void 0 ? void 0 : _b.call(model) });
+                    }
+                    return Object.assign({}, _options);
+                } });
+        };
         const animationConfig = {};
         Object.keys(config).forEach(key => {
             const value = config[key];
             if (isArray$1(value)) {
-                animationConfig[key] = value.map(item => {
-                    var _a;
-                    const options = (_a = item.options) !== null && _a !== void 0 ? _a : {};
-                    return Object.assign(Object.assign(Object.assign({}, defaultPrams), item), { options: (...args) => {
-                            var _a, _b;
-                            const _options = typeof options === 'function' ? options(...args) : options;
-                            return Object.assign(Object.assign({}, _options), { layoutRect: (_b = (_a = this.model).getLayoutRect) === null || _b === void 0 ? void 0 : _b.call(_a) });
-                        } });
-                });
+                animationConfig[key] = value.map(formatAnimationCfg);
             }
-            else {
-                animationConfig[key] = Object.assign(Object.assign({}, defaultPrams), config[key]);
+            else if (isValid$1(value)) {
+                animationConfig[key] = formatAnimationCfg(value);
             }
         });
         this._animationConfig = animationConfig;
     }
+    disableAnimationByState(state) {
+        const states = array(state);
+        this._disabledAnimationStates = [...new Set([...this._disabledAnimationStates, ...states])];
+    }
+    enableAnimationByState(state) {
+        const states = array(state);
+        this._disabledAnimationStates = this._disabledAnimationStates.filter(s => !states.includes(s));
+    }
     setSkipBeforeLayouted(skip) {
         this._skipBeforeLayouted = skip;
     }
@@ -53434,6 +53450,7 @@ class BaseMark extends GrammarItem {
         this._visible = true;
         this.stateStyle = {};
         this._unCompileChannel = {};
+        this._disabledAnimationStates = [];
         this._skipBeforeLayouted = false;
         this._extensionChannel = {};
         this._computeExChannel = {};
@@ -53851,6 +53868,7 @@ class BaseMark extends GrammarItem {
     }
     _getCommonContext() {
         return {
+            compiler: this.getCompiler(),
             markType: this.type,
             markId: this.id,
             modelId: this.model.id,
@@ -54538,7 +54556,10 @@ class BaseMark extends GrammarItem {
         }
     }
     hasAnimationByState(state) {
-        if (!state || !this._animationConfig || !this._animationConfig[state]) {
+        if (!state ||
+            !this._animationConfig ||
+            !this._animationConfig[state] ||
+            this._disabledAnimationStates.includes(state)) {
             return false;
         }
         const stateAnimationConfig = this._animationConfig[state];
@@ -55872,7 +55893,7 @@ class VChart {
         return this._beforeRender(option);
     }
     _reCompile(updateResult, morphConfig) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f, _g;
         if (updateResult.reMake) {
             this._releaseData();
             this._initDataSet();
@@ -55892,20 +55913,16 @@ class VChart {
         if (updateResult.reMake) {
             (_c = this._compiler) === null || _c === void 0 ? void 0 : _c.releaseGrammar();
             this._userEvents.forEach(e => { var _a; return (_a = this._event) === null || _a === void 0 ? void 0 : _a.on(e.eType, e.query, e.handler); });
-            if (updateResult.reSize) {
-                this._doResize();
-            }
         }
-        else {
-            if (updateResult.reCompile) {
-                (_d = this._compiler) === null || _d === void 0 ? void 0 : _d.clear({ chart: this._chart, vChart: this });
-                (_e = this._compiler) === null || _e === void 0 ? void 0 : _e.compile({ chart: this._chart, vChart: this });
-            }
-            if (updateResult.reSize) {
-                const { width, height } = this.getCurrentSize();
-                this._chart.onResize(width, height, false);
-                this._compiler.resize(width, height, false);
-            }
+        else if (updateResult.reCompile) {
+            (_d = this._compiler) === null || _d === void 0 ? void 0 : _d.clear({ chart: this._chart, vChart: this });
+            (_e = this._compiler) === null || _e === void 0 ? void 0 : _e.compile({ chart: this._chart, vChart: this });
+        }
+        if (updateResult.reSize) {
+            const { width, height } = this.getCurrentSize();
+            this._currentSize = { width, height };
+            (_f = this._chart) === null || _f === void 0 ? void 0 : _f.onResize(width, height, false);
+            (_g = this._compiler) === null || _g === void 0 ? void 0 : _g.resize(width, height, false);
         }
     }
     _beforeRender(option = {}) {
@@ -56898,7 +56915,7 @@ const lookup = (data, opt) => {
     });
 };
 
-const version = "2.0.1-alpha.3";
+const version = "2.0.1-alpha.4";
 
 const addVChartProperty = (data, op) => {
     const context = op.beforeCall();
@@ -63106,6 +63123,24 @@ class BandAxisMixin {
             };
         }
     }
+    _updateData() {
+        var _a, _b, _c;
+        const tickTransformType = this.registerTicksTransform();
+        if (this._spec.showAllGroupLayers && this._scales.length > 1) {
+            const layers = (_a = this._spec.layers) !== null && _a !== void 0 ? _a : [];
+            Object.keys(this._tickDataMap).forEach(layer => {
+                const layerConfig = layers[this._scales.length - 1 - +layer] || {};
+                const tickData = this._tickDataMap[layer];
+                const tickTransform = tickData === null || tickData === void 0 ? void 0 : tickData.getDataView().transformsArr.find((t) => t.type === tickTransformType);
+                tickTransform &&
+                    (tickTransform.options = Object.assign(Object.assign({}, this._tickTransformOption()), layerConfig));
+            });
+        }
+        else {
+            const tickTransform = (_c = (_b = this._tickData) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.getDataView().transformsArr.find(t => t.type === tickTransformType);
+            tickTransform && (tickTransform.options = this._tickTransformOption());
+        }
+    }
     dataToPosition(values, cfg = {}) {
         var _a, _b;
         if (values.length === 0 || this._scales.length === 0) {
@@ -63198,7 +63233,7 @@ class BandAxisMixin {
     getLabelItems(length) {
         const labelItems = [];
         let preData = [];
-        this._scales.forEach((scale, index) => {
+        (this._spec.showAllGroupLayers ? this._scales : [this._scales[0]]).forEach((scale, index) => {
             var _a;
             const tickData = this._tickDataMap[index];
             const isTickDataHaveData = (_a = tickData === null || tickData === void 0 ? void 0 : tickData.getLatestData()) === null || _a === void 0 ? void 0 : _a.length;
@@ -63380,6 +63415,20 @@ class CartesianBandAxis extends CartesianAxis {
             minBandSize
         };
     }
+    _compareSpec(spec, prevSpec) {
+        const result = super._compareSpec(spec, prevSpec);
+        if (result.reMake) {
+            return result;
+        }
+        if ((prevSpec === null || prevSpec === void 0 ? void 0 : prevSpec.showAllGroupLayers) !== (spec === null || spec === void 0 ? void 0 : spec.showAllGroupLayers) || !isEqual(prevSpec === null || prevSpec === void 0 ? void 0 : prevSpec.layers, spec === null || spec === void 0 ? void 0 : spec.layers)) {
+            result.reMake = true;
+        }
+        return result;
+    }
+    reInit(spec) {
+        super.reInit();
+        this === null || this === void 0 ? void 0 : this._updateData();
+    }
 }
 CartesianBandAxis.type = ComponentTypeEnum.cartesianBandAxis;
 CartesianBandAxis.specKey = 'axes';
@@ -65491,17 +65540,11 @@ class BaseChart extends CompilableBase {
     }
     _enableMarkAnimation(states) {
         const marks = this.getAllMarks();
-        marks.forEach(mark => {
-            const product = mark.getProduct();
-            if (product && product.animate) ;
-        });
+        marks.forEach(mark => mark.enableAnimationByState(states));
     }
     _disableMarkAnimation(states) {
         const marks = this.getAllMarks();
-        marks.forEach(mark => {
-            const product = mark.getProduct();
-            if (product && product.animate) ;
-        });
+        marks.forEach(mark => mark.disableAnimationByState(states));
     }
     filterGraphicsByDatum(datum, opt = {}) {
         var _a;

package/build/index.js

@@ -50249,6 +50249,9 @@
             this._container = container;
             this._option = option;
         }
+        getChart() {
+            return this._compileChart;
+        }
         getCanvas() {
             var _a;
             return (_a = this._stage) === null || _a === void 0 ? void 0 : _a.window.getNativeHandler().nativeCanvas;
@@ -53286,26 +53289,39 @@
         }
         setAnimationConfig(config) {
             const defaultPrams = this.type === 'group' ? { selfOnly: true } : {};
+            const formatAnimationCfg = (cfg) => {
+                var _a;
+                const options = (_a = cfg.options) !== null && _a !== void 0 ? _a : {};
+                return Object.assign(Object.assign(Object.assign({}, defaultPrams), cfg), { options: (datum, graphic, customParams) => {
+                        var _a, _b;
+                        const _options = typeof options === 'function' ? options(datum, graphic, customParams) : options;
+                        if (graphic && graphic.context && graphic.context.compiler && isValid$1(graphic.context.modelId)) {
+                            const model = (_a = graphic.context.compiler.getChart()) === null || _a === void 0 ? void 0 : _a.getModelById(graphic.context.modelId);
+                            return Object.assign(Object.assign({}, _options), { layoutRect: (_b = model === null || model === void 0 ? void 0 : model.getLayoutRect) === null || _b === void 0 ? void 0 : _b.call(model) });
+                        }
+                        return Object.assign({}, _options);
+                    } });
+            };
             const animationConfig = {};
             Object.keys(config).forEach(key => {
                 const value = config[key];
                 if (isArray$1(value)) {
-                    animationConfig[key] = value.map(item => {
-                        var _a;
-                        const options = (_a = item.options) !== null && _a !== void 0 ? _a : {};
-                        return Object.assign(Object.assign(Object.assign({}, defaultPrams), item), { options: (...args) => {
-                                var _a, _b;
-                                const _options = typeof options === 'function' ? options(...args) : options;
-                                return Object.assign(Object.assign({}, _options), { layoutRect: (_b = (_a = this.model).getLayoutRect) === null || _b === void 0 ? void 0 : _b.call(_a) });
-                            } });
-                    });
+                    animationConfig[key] = value.map(formatAnimationCfg);
                 }
-                else {
-                    animationConfig[key] = Object.assign(Object.assign({}, defaultPrams), config[key]);
+                else if (isValid$1(value)) {
+                    animationConfig[key] = formatAnimationCfg(value);
                 }
             });
             this._animationConfig = animationConfig;
         }
+        disableAnimationByState(state) {
+            const states = array(state);
+            this._disabledAnimationStates = [...new Set([...this._disabledAnimationStates, ...states])];
+        }
+        enableAnimationByState(state) {
+            const states = array(state);
+            this._disabledAnimationStates = this._disabledAnimationStates.filter(s => !states.includes(s));
+        }
         setSkipBeforeLayouted(skip) {
             this._skipBeforeLayouted = skip;
         }
@@ -53440,6 +53456,7 @@
             this._visible = true;
             this.stateStyle = {};
             this._unCompileChannel = {};
+            this._disabledAnimationStates = [];
             this._skipBeforeLayouted = false;
             this._extensionChannel = {};
             this._computeExChannel = {};
@@ -53857,6 +53874,7 @@
         }
         _getCommonContext() {
             return {
+                compiler: this.getCompiler(),
                 markType: this.type,
                 markId: this.id,
                 modelId: this.model.id,
@@ -54544,7 +54562,10 @@
             }
         }
         hasAnimationByState(state) {
-            if (!state || !this._animationConfig || !this._animationConfig[state]) {
+            if (!state ||
+                !this._animationConfig ||
+                !this._animationConfig[state] ||
+                this._disabledAnimationStates.includes(state)) {
                 return false;
             }
             const stateAnimationConfig = this._animationConfig[state];
@@ -55878,7 +55899,7 @@
             return this._beforeRender(option);
         }
         _reCompile(updateResult, morphConfig) {
-            var _a, _b, _c, _d, _e;
+            var _a, _b, _c, _d, _e, _f, _g;
             if (updateResult.reMake) {
                 this._releaseData();
                 this._initDataSet();
@@ -55898,20 +55919,16 @@
             if (updateResult.reMake) {
                 (_c = this._compiler) === null || _c === void 0 ? void 0 : _c.releaseGrammar();
                 this._userEvents.forEach(e => { var _a; return (_a = this._event) === null || _a === void 0 ? void 0 : _a.on(e.eType, e.query, e.handler); });
-                if (updateResult.reSize) {
-                    this._doResize();
-                }
             }
-            else {
-                if (updateResult.reCompile) {
-                    (_d = this._compiler) === null || _d === void 0 ? void 0 : _d.clear({ chart: this._chart, vChart: this });
-                    (_e = this._compiler) === null || _e === void 0 ? void 0 : _e.compile({ chart: this._chart, vChart: this });
-                }
-                if (updateResult.reSize) {
-                    const { width, height } = this.getCurrentSize();
-                    this._chart.onResize(width, height, false);
-                    this._compiler.resize(width, height, false);
-                }
+            else if (updateResult.reCompile) {
+                (_d = this._compiler) === null || _d === void 0 ? void 0 : _d.clear({ chart: this._chart, vChart: this });
+                (_e = this._compiler) === null || _e === void 0 ? void 0 : _e.compile({ chart: this._chart, vChart: this });
+            }
+            if (updateResult.reSize) {
+                const { width, height } = this.getCurrentSize();
+                this._currentSize = { width, height };
+                (_f = this._chart) === null || _f === void 0 ? void 0 : _f.onResize(width, height, false);
+                (_g = this._compiler) === null || _g === void 0 ? void 0 : _g.resize(width, height, false);
             }
         }
         _beforeRender(option = {}) {
@@ -56904,7 +56921,7 @@
         });
     };
 
-    const version = "2.0.1-alpha.3";
+    const version = "2.0.1-alpha.4";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -63112,6 +63129,24 @@
                 };
             }
         }
+        _updateData() {
+            var _a, _b, _c;
+            const tickTransformType = this.registerTicksTransform();
+            if (this._spec.showAllGroupLayers && this._scales.length > 1) {
+                const layers = (_a = this._spec.layers) !== null && _a !== void 0 ? _a : [];
+                Object.keys(this._tickDataMap).forEach(layer => {
+                    const layerConfig = layers[this._scales.length - 1 - +layer] || {};
+                    const tickData = this._tickDataMap[layer];
+                    const tickTransform = tickData === null || tickData === void 0 ? void 0 : tickData.getDataView().transformsArr.find((t) => t.type === tickTransformType);
+                    tickTransform &&
+                        (tickTransform.options = Object.assign(Object.assign({}, this._tickTransformOption()), layerConfig));
+                });
+            }
+            else {
+                const tickTransform = (_c = (_b = this._tickData) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.getDataView().transformsArr.find(t => t.type === tickTransformType);
+                tickTransform && (tickTransform.options = this._tickTransformOption());
+            }
+        }
         dataToPosition(values, cfg = {}) {
             var _a, _b;
             if (values.length === 0 || this._scales.length === 0) {
@@ -63204,7 +63239,7 @@
         getLabelItems(length) {
             const labelItems = [];
             let preData = [];
-            this._scales.forEach((scale, index) => {
+            (this._spec.showAllGroupLayers ? this._scales : [this._scales[0]]).forEach((scale, index) => {
                 var _a;
                 const tickData = this._tickDataMap[index];
                 const isTickDataHaveData = (_a = tickData === null || tickData === void 0 ? void 0 : tickData.getLatestData()) === null || _a === void 0 ? void 0 : _a.length;
@@ -63386,6 +63421,20 @@
                 minBandSize
             };
         }
+        _compareSpec(spec, prevSpec) {
+            const result = super._compareSpec(spec, prevSpec);
+            if (result.reMake) {
+                return result;
+            }
+            if ((prevSpec === null || prevSpec === void 0 ? void 0 : prevSpec.showAllGroupLayers) !== (spec === null || spec === void 0 ? void 0 : spec.showAllGroupLayers) || !isEqual(prevSpec === null || prevSpec === void 0 ? void 0 : prevSpec.layers, spec === null || spec === void 0 ? void 0 : spec.layers)) {
+                result.reMake = true;
+            }
+            return result;
+        }
+        reInit(spec) {
+            super.reInit();
+            this === null || this === void 0 ? void 0 : this._updateData();
+        }
     }
     CartesianBandAxis.type = ComponentTypeEnum.cartesianBandAxis;
     CartesianBandAxis.specKey = 'axes';
@@ -65497,17 +65546,11 @@
         }
         _enableMarkAnimation(states) {
             const marks = this.getAllMarks();
-            marks.forEach(mark => {
-                const product = mark.getProduct();
-                if (product && product.animate) ;
-            });
+            marks.forEach(mark => mark.enableAnimationByState(states));
         }
         _disableMarkAnimation(states) {
             const marks = this.getAllMarks();
-            marks.forEach(mark => {
-                const product = mark.getProduct();
-                if (product && product.animate) ;
-            });
+            marks.forEach(mark => mark.disableAnimationByState(states));
         }
         filterGraphicsByDatum(datum, opt = {}) {
             var _a;