@visactor/vchart 2.1.0-alpha.0 → 2.1.0-alpha.2

package/esm/chart/base/base-chart.js

@@ -38,7 +38,7 @@ import { ChartEvent, HOOK_EVENT } from "../../constant/event";
 
 import { DimensionEventEnum } from "../../event/events/dimension/interface";
 
-import { calculateChartSize, mergeUpdateResult } from "../util";
+import { calculateChartSize, isUpdateSpecResultComponentOnly, isUpdateSpecResultLocalOnly, mergeUpdateResult } from "../util";
 
 import { isDiscrete } from "@visactor/vscale";
 
@@ -50,6 +50,12 @@ import { Interaction } from "../../interaction/interaction";
 
 import { animationConfig, userAnimationConfig } from "../../animation/utils";
 
+const MARKER_COMPONENT_SPEC_KEYS = {
+    [ComponentTypeEnum.markPoint]: !0,
+    [ComponentTypeEnum.markLine]: !0,
+    [ComponentTypeEnum.markArea]: !0
+};
+
 export class BaseChart extends CompilableBase {
     getSpec() {
         return this._spec;
@@ -94,7 +100,7 @@ export class BaseChart extends CompilableBase {
     constructor(spec, option) {
         var _a, _b, _c, _d;
         super(option), this.type = "chart", this.id = createID(), this._regions = [], this._series = [], 
-        this._components = [], this._layoutRect = {
+        this._components = [], this._specTransformer = null, this._layoutRect = {
             x: 0,
             y: 0,
             width: DEFAULT_CHART_WIDTH,
@@ -153,8 +159,8 @@ export class BaseChart extends CompilableBase {
         }), this._setModelOption && this._setModelOption(), this._spec = spec;
     }
     created(transformer) {
-        this._chartData.parseData(this._spec.data), this._createGlobalScale(), this._createBackground(), 
-        this._createLayout(), transformer.forEachRegionInSpec(this._spec, this._createRegion.bind(this)), 
+        this._specTransformer = transformer, this._chartData.parseData(this._spec.data), 
+        this._createGlobalScale(), this._createBackground(), this._createLayout(), transformer.forEachRegionInSpec(this._spec, this._createRegion.bind(this)), 
         transformer.forEachSeriesInSpec(this._spec, this._createSeries.bind(this)), transformer.forEachComponentInSpec(this._spec, this._createComponent.bind(this), this._option.getSpecInfo());
     }
     _initInteractions() {
@@ -446,11 +452,14 @@ export class BaseChart extends CompilableBase {
     _getSpecKeys(spec) {
         const ignoreKeys = {
             width: !0,
-            height: !0
+            height: !0,
+            xField: !0,
+            yField: !0
         };
         return Object.keys(spec).filter((key => !ignoreKeys[key])).sort();
     }
     updateSpec(spec) {
+        var _a;
         const result = {
             change: !1,
             reMake: !1,
@@ -458,20 +467,32 @@ export class BaseChart extends CompilableBase {
             reSize: !1,
             reCompile: !1
         };
-        if (this.setLayoutTag(!0, null, !1), spec.type !== this.type) return result.reMake = !0, 
+        if (spec.type !== this.type) return result.reMake = !0, this.setLayoutTag(!0, null, !1), 
         result;
         const currentKeys = this._getSpecKeys(this._spec), nextKeys = this._getSpecKeys(spec);
-        if (!isEqual(currentKeys, nextKeys)) return result.reMake = !0, result;
+        if (!isEqual(currentKeys, nextKeys)) return result.reMake = !0, this.setLayoutTag(!0, null, !1), 
+        result;
         for (let i = 0; i < currentKeys.length; i++) {
-            const key = currentKeys[i];
-            if (isArray(this._spec[key]) && this._spec[key].length !== array(spec[key]).length) return result.reMake = !0, 
-            result;
+            const key = currentKeys[i], currentSpec = this._spec[key], nextSpec = spec[key];
+            if (isArray(currentSpec) && currentSpec.length !== array(nextSpec).length && !this._canRemoveMarkerComponentsWithoutRemake(key, currentSpec, nextSpec)) return result.reMake = !0, 
+            this.setLayoutTag(!0, null, !1), result;
         }
-        const oldSpec = this._spec;
-        return this._spec = spec, this.updateChartConfig(result, oldSpec), result.reMake ? result : (this.updateGlobalScale(result), 
-        result.reMake ? result : (this.updateRegionSpec(result), result.reMake ? result : (this.updateComponentSpec(result), 
-        result.reMake ? result : (this.updateSeriesSpec(result), result.reMake || (this.reInit(), 
-        this.updateDataSpec(), this.updateGlobalScaleDomain()), result))));
+        const oldSpec = this._spec, onlyMarkerComponentsRemoved = this._isOnlyMarkerComponentsRemoved(this._spec, spec, currentKeys), onlyComponentSpecsChanged = this._isOnlyComponentSpecsChanged(this._spec, spec, currentKeys), onlySeriesSpecsChanged = this._isOnlySeriesSpecsChanged(this._spec, spec, currentKeys);
+        if (this._spec = spec, onlyMarkerComponentsRemoved) return this._removeMarkerComponentsForEmptySpecs(result), 
+        result;
+        if (this.updateChartConfig(result, oldSpec), result.reMake) return this.setLayoutTag(!0, null, !1), 
+        result;
+        if (this.updateGlobalScale(result), result.reMake) return this.setLayoutTag(!0, null, !1), 
+        result;
+        if (this.updateRegionSpec(result), result.reMake) return this.setLayoutTag(!0, null, !1), 
+        result;
+        const componentUpdateResult = this.updateComponentSpec(result);
+        return result.reMake ? (this.setLayoutTag(!0, null, !1), result) : isUpdateSpecResultLocalOnly(result) ? result : onlyComponentSpecsChanged && !componentUpdateResult.hasNonComponentOnlyUpdate && isUpdateSpecResultComponentOnly(result) ? (componentUpdateResult.componentOnlyUpdatedComponents.forEach((component => {
+            component.reInit(component.getSpec());
+        })), (null === (_a = result.effects) || void 0 === _a ? void 0 : _a.layout) && this.setLayoutTag(!0, null, !1), 
+        result) : (this.setLayoutTag(!0, null, !1), this.updateSeriesSpec(result), result.reMake || (this.reInit(), 
+        onlySeriesSpecsChanged && this._canSkipChartDataStages(result) || (this.updateDataSpec(), 
+        this.updateGlobalScaleDomain())), result);
     }
     updateChartConfig(result, oldSpec) {
         var _a, _b;
@@ -488,32 +509,99 @@ export class BaseChart extends CompilableBase {
         })) : result.reMake = !0);
     }
     updateComponentSpec(result) {
+        const componentOnlyUpdatedComponents = [];
+        let hasNonComponentOnlyUpdate = !1;
         const componentCache = {}, checkVisibleComponents = {
             [ComponentTypeEnum.title]: !0,
             [ComponentTypeEnum.brush]: !0,
             [ComponentTypeEnum.indicator]: !0
-        };
+        }, removedComponents = [];
         this._components.forEach((c => {
             var _a, _b;
             if (c.type === ComponentTypeEnum.label || c.type === ComponentTypeEnum.totalLabel) return;
             checkVisibleComponents[c.type] && (checkVisibleComponents[c.type] = !1);
             const compSpecKey = c.specKey || c.type, cmpSpec = null !== (_a = this._spec[compSpecKey]) && void 0 !== _a ? _a : {};
-            isArray(cmpSpec) ? (componentCache[compSpecKey] = componentCache[compSpecKey] || {
-                specCount: cmpSpec.length,
-                componentCount: 0
-            }, componentCache[compSpecKey].componentCount++, mergeUpdateResult(result, c.updateSpec(null !== (_b = cmpSpec[c.getSpecIndex()]) && void 0 !== _b ? _b : {}, cmpSpec))) : mergeUpdateResult(result, c.updateSpec(cmpSpec));
+            if (isArray(cmpSpec)) {
+                if (componentCache[compSpecKey] = componentCache[compSpecKey] || {
+                    specCount: cmpSpec.length,
+                    componentCount: 0
+                }, this._canRemoveMarkerComponentsWithoutRemake(compSpecKey, [ c.getSpec() ], cmpSpec)) return void removedComponents.push(c);
+                componentCache[compSpecKey].componentCount++;
+                const componentSpec = null !== (_b = cmpSpec[c.getSpecIndex()]) && void 0 !== _b ? _b : {}, previousComponentSpec = c.getSpec(), componentResult = c.updateSpec(componentSpec, cmpSpec);
+                isUpdateSpecResultComponentOnly(componentResult) ? componentOnlyUpdatedComponents.push(c) : isEqual(previousComponentSpec, componentSpec) || (hasNonComponentOnlyUpdate = !0), 
+                mergeUpdateResult(result, componentResult);
+            } else {
+                const previousComponentSpec = c.getSpec(), componentResult = c.updateSpec(cmpSpec);
+                isUpdateSpecResultComponentOnly(componentResult) ? componentOnlyUpdatedComponents.push(c) : isEqual(previousComponentSpec, cmpSpec) || (hasNonComponentOnlyUpdate = !0), 
+                mergeUpdateResult(result, componentResult);
+            }
         }));
         for (const key in componentCache) if (Object.prototype.hasOwnProperty.call(componentCache, key)) {
             const element = componentCache[key];
             element.componentCount !== element.specCount && (result.reMake = !0);
         }
+        removedComponents.length && (removedComponents.forEach((component => {
+            this._removeComponent(component);
+        })), result.change = !0, result.effects = Object.assign(Object.assign({}, result.effects), {
+            component: !0,
+            localOnly: !0
+        }));
         const isVisible = compSpec => compSpec && !1 !== compSpec.visible;
-        Object.keys(checkVisibleComponents).forEach((type => {
+        return Object.keys(checkVisibleComponents).forEach((type => {
             if (checkVisibleComponents[type]) {
                 const compSpec = this._spec[type];
                 (isArray(compSpec) ? compSpec.some(isVisible) : isVisible(compSpec)) && (result.reMake = !0);
             }
+        })), {
+            componentOnlyUpdatedComponents: componentOnlyUpdatedComponents,
+            hasNonComponentOnlyUpdate: hasNonComponentOnlyUpdate
+        };
+    }
+    _canRemoveMarkerComponentsWithoutRemake(key, currentSpec, nextSpec) {
+        return MARKER_COMPONENT_SPEC_KEYS[key] && isArray(currentSpec) && currentSpec.length > 0 && isArray(nextSpec) && 0 === nextSpec.length;
+    }
+    _isOnlyMarkerComponentsRemoved(currentSpec, nextSpec, specKeys) {
+        let hasMarkerRemoval = !1;
+        const onlyMarkerRemoval = specKeys.every((key => this._canRemoveMarkerComponentsWithoutRemake(key, currentSpec[key], nextSpec[key]) ? (hasMarkerRemoval = !0, 
+        !0) : isEqual(currentSpec[key], nextSpec[key])));
+        return hasMarkerRemoval && onlyMarkerRemoval;
+    }
+    _isComponentSpecKey(key) {
+        return this._components.some((component => (component.specKey || component.type) === key));
+    }
+    _isOnlyComponentSpecsChanged(currentSpec, nextSpec, specKeys) {
+        let hasComponentSpecChange = !1;
+        const currentSpecRecord = currentSpec, nextSpecRecord = nextSpec, onlyComponentSpecChange = specKeys.every((key => !!isEqual(currentSpecRecord[key], nextSpecRecord[key]) || !!this._isComponentSpecKey(key) && (hasComponentSpecChange = !0, 
+        !0)));
+        return hasComponentSpecChange && onlyComponentSpecChange;
+    }
+    _isOnlySeriesSpecsChanged(currentSpec, nextSpec, specKeys) {
+        var _a, _b;
+        let hasSeriesSpecChange = !1;
+        const currentSpecRecord = currentSpec, nextSpecRecord = nextSpec, seriesRelatedSpecKeys = null !== (_b = null === (_a = this._specTransformer) || void 0 === _a ? void 0 : _a.getSeriesRelatedSpecKeys()) && void 0 !== _b ? _b : {}, onlySeriesSpecChange = specKeys.every((key => !!isEqual(currentSpecRecord[key], nextSpecRecord[key]) || !!seriesRelatedSpecKeys[key] && (hasSeriesSpecChange = !0, 
+        !0)));
+        return hasSeriesSpecChange && onlySeriesSpecChange;
+    }
+    _canSkipChartDataStages(result) {
+        const effects = result.effects;
+        return !(!(null == effects ? void 0 : effects.series) || effects.remake || effects.data || effects.scaleDomain || result.reMake);
+    }
+    _removeMarkerComponentsForEmptySpecs(result) {
+        const removedComponents = this._components.filter((component => {
+            var _a;
+            const compSpecKey = component.specKey || component.type, cmpSpec = null !== (_a = this._spec[compSpecKey]) && void 0 !== _a ? _a : {};
+            return this._canRemoveMarkerComponentsWithoutRemake(compSpecKey, [ component.getSpec() ], cmpSpec);
         }));
+        removedComponents.length && (removedComponents.forEach((component => {
+            this._removeComponent(component);
+        })), result.change = !0, result.effects = Object.assign(Object.assign({}, result.effects), {
+            component: !0,
+            localOnly: !0
+        }));
+    }
+    _removeComponent(component) {
+        this._components = this._components.filter((c => c !== component)), this._idMap.delete(component.id), 
+        component.release();
     }
     updateSeriesSpec(result) {
         this._spec.series.length === this._series.length ? this._series.forEach((s => {
@@ -610,8 +698,8 @@ export class BaseChart extends CompilableBase {
             c.compile();
         })), null === (_d = null === (_c = this._option.performanceHook) || void 0 === _c ? void 0 : _c.afterComponentCompile) || void 0 === _d || _d.call(_c, this._option.globalInstance);
     }
-    release() {
-        [ ...this._components, ...this._regions, ...this._series ].forEach((m => {
+    release(forceReleaseVRenderComponents = !0) {
+        forceReleaseVRenderComponents && [ ...this._components, ...this._regions, ...this._series ].forEach((m => {
             m.beforeRelease();
         })), super.release(), this.clear(), [ ...this._components, ...this._regions, ...this._series ].forEach((m => {
             m.release();