@visactor/vchart 1.11.8 → 1.11.9

package/build/index.js

@@ -23573,13 +23573,14 @@
         if (!this.htmlMap || !this.htmlMap[id]) return;
         const {
           root: root,
-          wrapContainer: wrapContainer
+          wrapContainer: wrapContainer,
+          unmount: unmount
         } = this.htmlMap[id];
         if (root) {
           application.global.getRequestAnimationFrame()(() => {
             root.unmount();
           });
-        }
+        } else unmount && unmount();
         wrapContainer && application.global.removeDom(wrapContainer), this.htmlMap[id] = null;
       }
       renderGraphicHTML(graphic) {
@@ -23595,23 +23596,31 @@
             element: element,
             container: container
           } = react;
-        if (!(element && ReactDOM && ReactDOM.createRoot)) return;
+        if (!element || !ReactDOM || !ReactDOM.createRoot && !ReactDOM.render) return;
         const id = isNil$1(react.id) ? `${null !== (_a = graphic.id) && void 0 !== _a ? _a : graphic._uid}_react` : react.id;
-        if (this.htmlMap && this.htmlMap[id] && container && container !== this.htmlMap[id].container && this.removeElement(id), this.htmlMap && this.htmlMap[id]) this.htmlMap[id].root.render(element);else {
+        if (this.htmlMap && this.htmlMap[id] && container && container !== this.htmlMap[id].container && this.removeElement(id), this.htmlMap && this.htmlMap[id]) ReactDOM.createRoot ? this.htmlMap[id].root.render(element) : ReactDOM.render(element, this.htmlMap[id].wrapContainer);else {
           const {
             wrapContainer: wrapContainer,
             nativeContainer: nativeContainer
           } = this.getWrapContainer(stage, container);
-          if (wrapContainer) {
+          if (wrapContainer) if (this.htmlMap || (this.htmlMap = {}), ReactDOM.createRoot) {
             const root = ReactDOM.createRoot(wrapContainer);
-            root.render(element), this.htmlMap || (this.htmlMap = {}), this.htmlMap[id] = {
+            root.render(element), this.htmlMap[id] = {
               root: root,
               wrapContainer: wrapContainer,
               nativeContainer: nativeContainer,
               container: container,
               renderId: this.renderId
             };
-          }
+          } else ReactDOM.render(element, wrapContainer), this.htmlMap[id] = {
+            wrapContainer: wrapContainer,
+            nativeContainer: nativeContainer,
+            container: container,
+            renderId: this.renderId,
+            unmount: () => {
+              ReactDOM.unmountComponentAtNode(wrapContainer);
+            }
+          };
         }
         if (!this.htmlMap || !this.htmlMap[id]) return;
         const {
@@ -57280,7 +57289,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             reMake: merge('reMake'),
             reRender: merge('reRender'),
             reSize: merge('reSize'),
-            reTransformSpec: merge('reTransformSpec')
+            reTransformSpec: merge('reTransformSpec'),
+            changeTheme: merge('changeTheme')
         });
         return target;
     }
@@ -61086,7 +61096,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this._dataSet;
         }
         constructor(spec, options) {
-            var _a, _b, _c, _d, _e, _f, _g;
+            var _a, _b, _c, _d, _e, _f;
             this.id = createID();
             this._userEvents = [];
             this._autoSize = true;
@@ -61106,7 +61116,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }, 100);
             this._option = merge$2(this._option, { animation: spec.animation !== false }, options);
             this._onError = (_a = this._option) === null || _a === void 0 ? void 0 : _a.onError;
-            const _h = this._option, { dom, renderCanvas, mode, stage, poptip } = _h, restOptions = __rest$7(_h, ["dom", "renderCanvas", "mode", "stage", "poptip"]);
+            const _g = this._option, { dom, renderCanvas, mode, stage, poptip } = _g, restOptions = __rest$7(_g, ["dom", "renderCanvas", "mode", "stage", "poptip"]);
             const isTrueBrowseEnv = isTrueBrowser(mode);
             if (isTrueBrowseEnv && dom) {
                 this._container = isString$1(dom) ? document === null || document === void 0 ? void 0 : document.getElementById(dom) : dom;
@@ -61140,11 +61150,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             this._eventDispatcher = new EventDispatcher(this, this._compiler);
             this._event = new Event$1(this._eventDispatcher, mode);
             this._compiler.initView();
-            (_d = this.getStage()) === null || _d === void 0 ? void 0 : _d.setTheme({
-                text: { fontFamily: (_e = this._currentTheme) === null || _e === void 0 ? void 0 : _e.fontFamily }
-            });
+            this._setFontFamilyTheme((_d = this._currentTheme) === null || _d === void 0 ? void 0 : _d.fontFamily);
             this._initDataSet(this._option.dataSet);
-            this._autoSize = isTrueBrowseEnv ? (_g = (_f = spec.autoFit) !== null && _f !== void 0 ? _f : this._option.autoFit) !== null && _g !== void 0 ? _g : true : false;
+            this._autoSize = isTrueBrowseEnv ? (_f = (_e = spec.autoFit) !== null && _e !== void 0 ? _e : this._option.autoFit) !== null && _f !== void 0 ? _f : true : false;
             this._bindResizeEvent();
             this._bindVGrammarViewEvent();
             this._initChartPlugin();
@@ -61329,6 +61337,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._chartSpecTransformer = null;
                 (_a = this._chart) === null || _a === void 0 ? void 0 : _a.release();
                 this._chart = null;
+                if (updateResult.changeTheme) {
+                    this._setCurrentTheme();
+                }
                 (_b = this._compiler) === null || _b === void 0 ? void 0 : _b.releaseGrammar(((_c = this._option) === null || _c === void 0 ? void 0 : _c.animation) === false || ((_d = this._spec) === null || _d === void 0 ? void 0 : _d.animation) === false);
                 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) {
@@ -61336,6 +61347,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 }
             }
             else {
+                if (updateResult.changeTheme) {
+                    this._setCurrentTheme();
+                }
                 if (updateResult.reCompile) {
                     (_e = this._compiler) === null || _e === void 0 ? void 0 : _e.clear({ chart: this._chart, vChart: this }, !this._option.animation || !this._spec.animation);
                     (_f = this._compiler) === null || _f === void 0 ? void 0 : _f.compile({ chart: this._chart, vChart: this }, {});
@@ -61595,31 +61609,31 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         _updateSpec(spec, forceMerge = false, userUpdateOptions) {
             var _a, _b;
             const lastSpec = this._spec;
+            const result = {
+                reTransformSpec: false,
+                change: false,
+                reMake: false,
+                reCompile: false,
+                reSize: false,
+                changeTheme: false
+            };
             if (!this._setNewSpec(spec, forceMerge)) {
                 return undefined;
             }
             if (!isEqual$1(lastSpec.theme, this._spec.theme)) {
-                this._setCurrentTheme();
+                result.changeTheme = true;
             }
             const reSize = this._shouldChartResize(lastSpec);
+            result.reSize = reSize;
             (_b = (_a = this._compiler) === null || _a === void 0 ? void 0 : _a.getVGrammarView()) === null || _b === void 0 ? void 0 : _b.updateLayoutTag();
             if (this._spec.type !== lastSpec.type) {
-                return {
-                    reTransformSpec: true,
-                    change: true,
-                    reMake: true,
-                    reCompile: false,
-                    reSize: reSize
-                };
+                result.reMake = true;
+                result.reTransformSpec = true;
+                result.change = true;
+                return result;
             }
             this._initChartSpec(this._spec, 'render');
-            const res = mergeUpdateResult(this._chart.updateSpec(this._spec), {
-                reTransformSpec: false,
-                change: reSize,
-                reMake: false,
-                reCompile: false,
-                reSize
-            });
+            const res = mergeUpdateResult(this._chart.updateSpec(this._spec), result);
             return userUpdateOptions
                 ? Object.assign(Object.assign({}, res), userUpdateOptions) : res;
         }
@@ -61852,11 +61866,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return this._currentThemeName;
         }
         setCurrentTheme(name) {
+            var _a;
             return __awaiter$7(this, void 0, void 0, function* () {
                 if (!ThemeManager.themeExist(name)) {
                     return this;
                 }
                 const result = this._setCurrentTheme(name);
+                this._setFontFamilyTheme((_a = this._currentTheme) === null || _a === void 0 ? void 0 : _a.fontFamily);
                 yield this.updateCustomConfigAndRerender(result, false, {
                     transformSpec: false,
                     actionSource: 'setCurrentTheme'
@@ -61865,10 +61881,12 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             });
         }
         setCurrentThemeSync(name) {
+            var _a;
             if (!ThemeManager.themeExist(name)) {
                 return this;
             }
             const result = this._setCurrentTheme(name);
+            this._setFontFamilyTheme((_a = this._currentTheme) === null || _a === void 0 ? void 0 : _a.fontFamily);
             this.updateCustomConfigAndRerender(result, true, {
                 transformSpec: false,
                 actionSource: 'setCurrentTheme'
@@ -61882,6 +61900,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             (_a = this._chart) === null || _a === void 0 ? void 0 : _a.setCurrentTheme();
             return { change: true, reMake: false };
         }
+        _setFontFamilyTheme(fontFamily) {
+            var _a;
+            if (!fontFamily) {
+                return;
+            }
+            (_a = this.getStage()) === null || _a === void 0 ? void 0 : _a.setTheme({ text: { fontFamily } });
+        }
         _getTooltipComponent() {
             var _a;
             const tooltip = (_a = this._chart) === null || _a === void 0 ? void 0 : _a.getComponentsByType(ComponentTypeEnum.tooltip)[0];
@@ -66504,7 +66529,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         registerComponentPlugin(CanvasTooltipHandler);
     };
 
-    const version = "1.11.8";
+    const version = "1.11.9";
 
     const addVChartProperty = (data, op) => {
         const context = op.beforeCall();
@@ -67287,11 +67312,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             }
         }
         getRawDataStatisticsByField(field, isNumeric) {
-            var _a, _b;
+            var _a, _b, _c;
             if (!this._rawStatisticsCache) {
                 this._rawStatisticsCache = {};
             }
-            if (!this._rawStatisticsCache[field]) {
+            if (!this._rawStatisticsCache[field] ||
+                (isNumeric && (isNil$1(this._rawStatisticsCache[field].min) || isNil$1(this._rawStatisticsCache[field].max))) ||
+                (!isNumeric && isNil$1(this._rawStatisticsCache[field].values))) {
                 const canUseViewStatistics = this._viewDataStatistics &&
                     (!this._viewDataFilter || this._viewDataFilter.transformsArr.length <= 1) &&
                     this.getViewData().transformsArr.length <= 1;
@@ -67311,16 +67338,13 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                         }
                     }
                     else {
-                        this._rawStatisticsCache[field] = dimensionStatisticsOfSimpleData(this._rawData.latestData, [
+                        const result = dimensionStatisticsOfSimpleData(this._rawData.latestData, [
                             { key: field, operations: isNumeric ? ['min', 'max'] : ['values'] }
                         ])[field];
+                        this._rawStatisticsCache[field] = merge$2((_c = this._rawStatisticsCache[field]) !== null && _c !== void 0 ? _c : {}, result);
                     }
                 }
             }
-            if (isNumeric && (isNil$1(this._rawStatisticsCache[field].min) || isNil$1(this._rawStatisticsCache[field].max))) {
-                this._rawStatisticsCache[field].min = minInArray(this._rawStatisticsCache[field].values);
-                this._rawStatisticsCache[field].max = maxInArray(this._rawStatisticsCache[field].values);
-            }
             return this._rawStatisticsCache[field];
         }
         _statisticViewData() {
@@ -72250,6 +72274,9 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             const componentCache = {};
             this._components.forEach(c => {
                 var _a, _b;
+                if (c.type === ComponentTypeEnum.label || c.type === ComponentTypeEnum.totalLabel) {
+                    return;
+                }
                 const compSpecKey = c.specKey || c.type;
                 const cmpSpec = (_a = this._spec[compSpecKey]) !== null && _a !== void 0 ? _a : {};
                 if (isArray$1(cmpSpec)) {
@@ -76275,7 +76302,7 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         _transformLabelSpec(spec) {
             this._addMarkLabelSpec(spec, "bar");
-            this._addMarkLabelSpec(spec, "bar", 'stackLabel');
+            this._addMarkLabelSpec(spec, "bar", 'stackLabel', 'initStackLabelMarkStyle');
         }
     }
 
@@ -76678,6 +76705,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
                 this._labelMark = labelMark;
                 return;
             }
+        }
+        initStackLabelMarkStyle(labelMark) {
+            if (!labelMark) {
+                return;
+            }
             this._stackLabelMark = labelMark;
             labelMark.skipEncode = true;
             labelMark.setRule('stackLabel');
@@ -79531,15 +79563,12 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         onBind() {
             const { angle: fromAngle, radius: fromRadius } = this._pointToCoord(this.from);
-            if (!isValidNumber$1(fromAngle * fromRadius)) {
-                this.valid = false;
-            }
-            this._fromAngle = fromAngle;
-            this._fromRadius = fromRadius;
             const { angle: toAngle, radius: toRadius } = this._pointToCoord(this.to);
             if (!isValidNumber$1(toAngle * toRadius)) {
                 this.valid = false;
             }
+            this._fromAngle = isValidNumber$1(fromAngle) ? fromAngle : toAngle;
+            this._fromRadius = isValidNumber$1(fromRadius) ? fromRadius : toRadius;
             this._toAngle = toAngle;
             this._toRadius = toRadius;
             if (isClose(this._fromAngle, this._toAngle) && isClose(this._fromRadius, this._toRadius)) {
@@ -79548,6 +79577,8 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         onUpdate(end, ratio, out) {
             if (this.valid === false) {
+                out.x = this.to.x;
+                out.y = this.to.y;
                 return;
             }
             if (end) {
@@ -86508,20 +86539,21 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
         }
         const isStartGap = "start" === this.options.gapPosition,
           isMiddleGap = !isStartGap && "end" !== this.options.gapPosition,
-          getNodeHeight = isNumber$1(this.options.nodeHeight) ? node => this.options.nodeHeight : isFunction$1(this.options.nodeHeight) ? this.options.nodeHeight : forceNodeHeight > 0 ? node => forceNodeHeight : node => Math.max(node.value * ky, minNodeHeight, 0),
+          getNodeHeight = isNumber$1(this.options.nodeHeight) ? node => this.options.nodeHeight : isFunction$1(this.options.nodeHeight) ? this.options.nodeHeight : forceNodeHeight > 0 ? node => forceNodeHeight : node => Math.max(node.value * ky, 0),
           getLinkHeight = isNumber$1(this.options.linkHeight) ? () => this.options.linkHeight : isFunction$1(this.options.linkHeight) ? this.options.linkHeight : (link, sourceNode, sourceNodeHeight) => Math.max(sourceNode.value ? sourceNodeHeight * linkClampe(link.value / sourceNode.value) : 0, minLinkHeight, 0);
         for (let i = 0, columnCount = columns.length; i < columnCount; i++) {
           const nodes = columns[i];
           if (!nodes || !nodes.length) continue;
           let y = this._viewBox.y0,
             gapY = 0,
-            nodeHeight = 0;
+            nodeHeight = 0,
+            calculatedNodeHeight = 0;
           for (let j = 0, len = nodes.length; j < len; j++) {
             const node = nodes[j];
-            gapY = getGapY(node), isStartGap && (y += gapY), nodeHeight = getNodeHeight(node), node.y0 = y, node.y1 = y + nodeHeight, y = isStartGap ? node.y1 : node.y1 + gapY;
+            gapY = getGapY(node), isStartGap && (y += gapY), calculatedNodeHeight = getNodeHeight(node), nodeHeight = Math.max(calculatedNodeHeight, minNodeHeight), node.y0 = y, node.y1 = y + nodeHeight, y = isStartGap ? node.y1 : node.y1 + gapY;
             for (let k = 0, linkLen = node.sourceLinks.length; k < linkLen; k++) {
               const link = node.sourceLinks[k];
-              link.thickness = getLinkHeight(link, node, nodeHeight);
+              link.thickness = getLinkHeight(link, node, calculatedNodeHeight);
             }
           }
           let deltaY = this._viewBox.y1 - y + (isMiddleGap ? gapY : 0);
@@ -93581,8 +93613,11 @@ C0.3-1.4,0.3-1.4,0.3-1.4z;`;
             return false;
         }
         _initTheme(spec, chartSpec) {
+            var _a;
             const { spec: newSpec, theme } = super._initTheme(spec, chartSpec);
             newSpec.style = mergeSpec({}, this._theme, newSpec.style);
+            newSpec.offset = mergeSpec({}, theme.offset, spec.offset);
+            newSpec.transitionDuration = (_a = spec.transitionDuration) !== null && _a !== void 0 ? _a : theme.transitionDuration;
             return { spec: newSpec, theme };
         }
         _transformSpecAfterMergingTheme(spec, chartSpec, chartSpecInfo) {