@visactor/vchart 1.2.1-alpha.1 → 1.2.1-alpha.3

package/build/index.js

@@ -51704,6 +51704,7 @@
 	    ChartEvent["drill"] = "drill";
 	    ChartEvent["layoutStart"] = "layoutStart";
 	    ChartEvent["layoutEnd"] = "layoutEnd";
+	    ChartEvent["layoutRectUpdate"] = "layoutRectUpdate";
 	    ChartEvent["playerPlay"] = "playerPlay";
 	    ChartEvent["playerPause"] = "playerPause";
 	    ChartEvent["playerEnd"] = "playerEnd";
@@ -52072,7 +52073,8 @@
 	};
 	const axisY = {
 	    label: {
-	        space: 20
+	        space: 20,
+	        autoLimit: true
 	    },
 	    title: {
 	        space: 20,
@@ -54384,7 +54386,7 @@
 	            });
 	        }
 	        else if (Array.isArray(values)) {
-	            dataView.parse(values);
+	            dataView.parse(cloneDeep(values));
 	        }
 	        else if (isString(values) &&
 	            (!parser || parser.type === 'csv' || parser.type === 'dsv' || parser.type === 'tsv')) {
@@ -55227,6 +55229,28 @@
 	        }
 	        return this;
 	    }
+	    updateDataInBatchesSync(list) {
+	        if (this._chart) {
+	            list.forEach(({ id, data, options }) => {
+	                this._chart.updateData(id, data, false, options);
+	            });
+	            this._chart.updateGlobalScaleDomain();
+	            this._compiler.renderSync();
+	            return this;
+	        }
+	        list.forEach(({ id, data, options }) => {
+	            const preDV = this._spec.data.find(dv => dv.name === id);
+	            if (preDV) {
+	                preDV.parse(data, options);
+	            }
+	            else {
+	                const dataView = new DataView(this._dataSet, { name: id });
+	                dataView.parse(data, options);
+	                this._spec.data.push(dataView);
+	            }
+	        });
+	        return this;
+	    }
 	    async updateSpec(spec, forceMerge = false, morphConfig) {
 	        if (!spec) {
 	            return this;
@@ -55279,14 +55303,16 @@
 	        await this._compiler.resize?.(width, height);
 	        return this;
 	    }
-	    updateViewBox(viewBox, reRender = true) {
+	    updateViewBox(viewBox, reRender = true, reLayout = true) {
 	        if (!this._chart || !this._compiler) {
 	            return this;
 	        }
 	        this._viewBox = viewBox;
-	        this._chart.updateViewBox(viewBox);
-	        this._compiler.renderSync();
-	        this._chart?.onEvaluateEnd();
+	        this._chart.updateViewBox(viewBox, reLayout);
+	        if (reLayout) {
+	            this._compiler.renderSync();
+	            this._chart?.onEvaluateEnd();
+	        }
 	        this._compiler.updateViewBox(viewBox, reRender);
 	        return this;
 	    }
@@ -55883,6 +55909,9 @@
 	    layoutLevel = LayoutLevel.Region;
 	    layoutZIndex = 0;
 	    chartLayoutRect;
+	    getVisible() {
+	        return this._spec?.visible !== false;
+	    }
 	    _setLayoutAttributeFromSpec(spec, chartViewRect) {
 	        if (this._spec.visible !== false) {
 	            const padding = normalizeLayoutPaddingSpec(spec.padding);
@@ -56724,9 +56753,7 @@
 	            this.updateState({
 	                animationState: {
 	                    callback: (datum, element) => {
-	                        return element.diffState === AnimationStateEnum.enter
-	                            ? AnimationStateEnum.appear
-	                            : AnimationStateEnum.none;
+	                        return element.diffState === 'exit' ? AnimationStateEnum.none : AnimationStateEnum.appear;
 	                    }
 	                }
 	            }, noRender);
@@ -56743,7 +56770,7 @@
 	        return {
 	            animationState: {
 	                callback: (datum, element) => {
-	                    return element.diffState === AnimationStateEnum.enter ? AnimationStateEnum.appear : AnimationStateEnum.none;
+	                    return element.diffState === 'exit' ? AnimationStateEnum.none : AnimationStateEnum.appear;
 	                }
 	            }
 	        };
@@ -57270,9 +57297,8 @@
 	        };
 	        const rightCurrent = this._chartViewBox.x2 - this._chartViewBox.x1 - this._rightCurrent;
 	        const bottomCurrent = this._chartViewBox.y2 - this._chartViewBox.y1 - this._bottomCurrent;
-	        items.filter;
 	        items.forEach(i => {
-	            if (!i.getAutoIndent()) {
+	            if (!i.getVisible() || !i.getAutoIndent()) {
 	                return;
 	            }
 	            const vOrH = i.layoutOrient === 'left' || i.layoutOrient === 'right';
@@ -58344,7 +58370,7 @@
 	VChart.useMark([ComponentMark, GroupMark, ImageMark]);
 	Factory.registerRegion('region', Region);
 	Factory.registerLayout('base', Layout);
-	const version = "1.2.1-alpha.1";
+	const version = "1.2.1-alpha.3";
 	Logger.getInstance(LoggerLevel.Error);
 
 	var SeriesMarkNameEnum;
@@ -58875,11 +58901,11 @@
 	    getLayoutTag() {
 	        return this._layoutTag;
 	    }
-	    setLayoutTag(tag, morphConfig) {
+	    setLayoutTag(tag, morphConfig, reLayout = true) {
 	        this._layoutTag = tag;
 	        if (this.getCompiler()?.getVGrammarView()) {
 	            this.getCompiler().getVGrammarView().updateLayoutTag();
-	            tag && this.getCompiler().reRenderAsync(morphConfig);
+	            tag && reLayout && this.getCompiler().reRenderAsync(morphConfig);
 	        }
 	        return this._layoutTag;
 	    }
@@ -58946,9 +58972,9 @@
 	        this._updateLayoutRect(this._option.viewBox);
 	        this.setLayoutTag(true);
 	    }
-	    updateViewBox(viewBox) {
+	    updateViewBox(viewBox, reLayout) {
 	        this._updateLayoutRect(viewBox);
-	        this.setLayoutTag(true);
+	        this.setLayoutTag(true, null, reLayout);
 	    }
 	    createBackground(bg) {
 	        if (!bg) {
@@ -59579,6 +59605,7 @@
 	        this._layoutRect.height = viewRect.height - this.padding.top - this.padding.bottom;
 	        this._layoutRect.x = this.padding.left;
 	        this._layoutRect.y = this.padding.top;
+	        this._event.emit(ChartEvent.layoutRectUpdate, {});
 	    }
 	    getCurrentTheme() {
 	        return this._theme;
@@ -68874,7 +68901,9 @@
 	        }
 	    }
 	    initProgressGroupMark() {
-	        this._progressGroupMark = this._createMark(LinearProgressSeries.mark.group);
+	        this._progressGroupMark = this._createMark(LinearProgressSeries.mark.group, {
+	            skipBeforeLayouted: false
+	        });
 	        return this._progressGroupMark;
 	    }
 	    initProgressGroupMarkStyle() {
@@ -69161,7 +69190,7 @@
 	class CloudLayout extends BaseLayout {
 	  constructor(options) {
 	    var _a;
-	    super(Object.assign({}, CloudLayout.defaultOptions, options)), this.cw = 64, this.ch = 2048, this._size = [256, 256], this._isBoardExpandCompleted = !1, this._placeStatus = 0, this._tTemp = null, this._dtTemp = null, this._dy = 0, this.cacheMap = new Map(), this.spiral = isString(this.options.spiral) ? null !== (_a = spirals[this.options.spiral]) && void 0 !== _a ? _a : spirals.archimedean : this.options.spiral, this.random = this.options.random ? Math.random : () => 1, this.getTextPadding = functor$1(this.options.padding);
+	    super(Object.assign({}, CloudLayout.defaultOptions, options)), this.cw = 64, this.ch = 2048, this._size = [256, 256], this._isBoardExpandCompleted = !1, this._placeStatus = 0, this._tTemp = null, this._dtTemp = null, this._dy = 0, this.cacheMap = new Map(), this.options.minFontSize <= CloudLayout.defaultOptions.minFontSize && (this.options.minFontSize = CloudLayout.defaultOptions.minFontSize), this.spiral = isString(this.options.spiral) ? null !== (_a = spirals[this.options.spiral]) && void 0 !== _a ? _a : spirals.archimedean : this.options.spiral, this.random = this.options.random ? Math.random : () => 1, this.getTextPadding = functor$1(this.options.padding);
 	  }
 	  zoomRatio() {
 	    return this._originSize[0] / this._size[0];
@@ -69183,7 +69212,7 @@
 	      x: d.x + d.x1,
 	      y: d.y + d.y1
 	    }], d.x -= this._size[0] >> 1, d.y -= this._size[1] >> 1, this._tTemp = null, this._dtTemp = null, !0;
-	    if (this.updateBoardExpandStatus(d.fontSize * (this._originSize[0] / this._size[0]) < this.options.minFontSize), d.hasText && this.shouldShrinkContinue()) {
+	    if (this.updateBoardExpandStatus(d.fontSize), d.hasText && this.shouldShrinkContinue()) {
 	      if (1 === this._placeStatus) {
 	        const maxSize0 = d.fontSize * this._originSize[0] / this.options.minFontSize,
 	          distSize0 = Math.max(d.width, d.height);
@@ -69192,7 +69221,7 @@
 	          this.expandBoard(this._board, maxSize0 / this._size[0]);
 	        }
 	      } else this._placeStatus, this.expandBoard(this._board);
-	      return this.updateBoardExpandStatus(d.fontSize * (this._originSize[0] / this._size[0]) < this.options.minFontSize), !1;
+	      return this.updateBoardExpandStatus(d.fontSize), !1;
 	    }
 	    return this._tTemp = null, this._dtTemp = null, !0;
 	  }
@@ -69230,8 +69259,10 @@
 	    })).sort(function (a, b) {
 	      return b.fontSize - a.fontSize;
 	    });
-	    for (this.data = data; i < n;) {
-	      if (this.layoutWord(i) && i++, this.progressiveIndex = i, this.exceedTime()) break;
+	    this.data = data;
+	    let curWordTryCount = 0;
+	    for (; i < n;) {
+	      if (this.layoutWord(i) || curWordTryCount >= 2 ? (i++, curWordTryCount = 0) : curWordTryCount++, this.progressiveIndex = i, this.exceedTime()) break;
 	    }
 	    if (!this.options.clip && this.options.enlarge && this._bounds && this.shrinkBoard(this._bounds), this._bounds && ["cardioid", "triangle", "triangle-upright"].includes(this.options.shape)) {
 	      const currentCenterY = (this._bounds[0].y + this._bounds[1].y) / 2;
@@ -69257,8 +69288,8 @@
 	  progressiveOutput() {
 	    return this.outputCallback ? this.outputCallback(this.formatTagItem(this.progressiveResult)) : this.formatTagItem(this.progressiveResult);
 	  }
-	  updateBoardExpandStatus(status) {
-	    this._isBoardExpandCompleted = status;
+	  updateBoardExpandStatus(fontSize) {
+	    this._isBoardExpandCompleted = fontSize * (this._originSize[0] / this._size[0]) < this.options.minFontSize;
 	  }
 	  shouldShrinkContinue() {
 	    return !this.options.clip && this.options.shrink && !this._isBoardExpandCompleted;
@@ -69465,7 +69496,8 @@
 	  return a.x + a.x1 > b[0].x && a.x + a.x0 < b[1].x && a.y + a.y1 > b[0].y && a.y + a.y0 < b[1].y;
 	}
 	CloudLayout.defaultOptions = {
-	  enlarge: !1
+	  enlarge: !1,
+	  minFontSize: 2
 	};
 	const isFullOutside = (tag, size) => tag.x + tag.x0 > size[0] || tag.y + tag.y0 > size[0] || tag.x + tag.x1 < 0 || tag.y + tag.y1 < 0,
 	  isPartOutside = (tag, size) => tag.x + tag.x0 < 0 || tag.y + tag.y0 < 0 || tag.x + tag.x1 > size[0] || tag.y + tag.y1 > size[1];
@@ -69755,8 +69787,10 @@
 	  angle: "angle"
 	};
 	const transform$2 = (options, upstreamData) => {
-	  var _a, _b, _c, _d, _e, _f, _g;
-	  if (options.size && (!options.size[0] || !options.size[1])) return upstreamData;
+	  var _a, _b, _c, _d, _e, _f;
+	  if (options.size && (options.size[0] <= 0 || options.size[1] <= 0)) {
+	    return Logger.getInstance().info("Wordcloud size dimensions must be greater than 0"), [];
+	  }
 	  const data = upstreamData,
 	    canvasSize = (null !== (_a = options.size) && void 0 !== _a ? _a : [500, 500]).slice();
 	  canvasSize[0] = Math.floor(canvasSize[0]), canvasSize[1] = Math.floor(canvasSize[1]);
@@ -69771,7 +69805,7 @@
 	    shrink = null !== (_d = options.shrink) && void 0 !== _d && _d,
 	    enlarge = null !== (_e = options.enlarge) && void 0 !== _e && _e,
 	    clip = null !== (_f = options.clip) && void 0 !== _f && _f,
-	    minFontSize = null !== (_g = options.minFontSize) && void 0 !== _g ? _g : 0,
+	    minFontSize = options.minFontSize,
 	    randomVisible = options.randomVisible,
 	    as = options.as || OUTPUT$1,
 	    depth_3d = options.depth_3d,
@@ -71072,6 +71106,10 @@
 	    }
 	    compile() {
 	        super.compile();
+	        const { width, height } = this._region.getLayoutRect();
+	        if (!isValidNumber(width) || !isValidNumber(height) || !(height > 0 && width > 0)) {
+	            return;
+	        }
 	        const wordCloudTransforms = [];
 	        const valueField = this._valueField;
 	        const valueScale = new LinearScale();
@@ -71119,7 +71157,7 @@
 	            wordCloudTransforms.push({
 	                type: 'wordcloud',
 	                layoutType: !isTrueBrowser(this._option.mode) ? 'fast' : this._wordCloudConfig.layoutMode,
-	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
+	                size: [width, height],
 	                shape: this._maskShape,
 	                dataIndexKey: DEFAULT_DATA_KEY,
 	                text: { field: textField },
@@ -71144,7 +71182,7 @@
 	            wordCloudTransforms.push({
 	                type: 'wordcloudShape',
 	                dataIndexKey: DEFAULT_DATA_KEY,
-	                size: [this._region.getLayoutRect().width, this._region.getLayoutRect().height],
+	                size: [width, height],
 	                shape: this._maskShape,
 	                text: { field: this._spec.word?.formatMethod ? WORD_CLOUD_TEXT : this._nameField },
 	                fontSize: valueField ? { field: valueField } : this._fontSizeRange[0],
@@ -81068,6 +81106,7 @@
 	    _axisStyle;
 	    _latestBounds;
 	    _verticalLimitSize;
+	    _layoutCache = { width: 0, height: 0, _lastComputeOutBounds: { x1: 0, x2: 0, y1: 0, y2: 0 } };
 	    constructor(spec, options) {
 	        super(spec, {
 	            ...options
@@ -81422,7 +81461,7 @@
 	        }
 	        result.width = Math.ceil(result.width);
 	        result.height = Math.ceil(result.height);
-	        return result;
+	        return this._setRectInSpec(this._layoutCacheProcessing(result));
 	    }
 	    boundsInRect(rect) {
 	        let result = { x1: 0, y1: 0, x2: 0, y2: 0 };
@@ -81574,6 +81613,9 @@
 	        super.initEvent();
 	        if (this.visible) {
 	            this.event.on(ChartEvent.layoutEnd, this._fixAxisOnZero);
+	            this.event.on(ChartEvent.layoutRectUpdate, () => {
+	                this._clearLayoutCache();
+	            });
 	        }
 	    }
 	    _fixAxisOnZero = () => {
@@ -81625,6 +81667,33 @@
 	            }
 	        }
 	    };
+	    _layoutCacheProcessing(rect) {
+	        ['width', 'height'].forEach(key => {
+	            if (rect[key] < this._layoutCache[key]) {
+	                rect[key] = this._layoutCache[key];
+	            }
+	            else {
+	                this._layoutCache[key] = rect[key];
+	            }
+	        });
+	        ['x1', 'x2', 'y1', 'y2'].forEach(key => {
+	            if (this._lastComputeOutBounds[key] < this._layoutCache._lastComputeOutBounds[key]) {
+	                this._lastComputeOutBounds[key] = this._layoutCache._lastComputeOutBounds[key];
+	            }
+	            else {
+	                this._layoutCache._lastComputeOutBounds[key] = this._lastComputeOutBounds[key];
+	            }
+	        });
+	        return rect;
+	    }
+	    _clearLayoutCache() {
+	        this._layoutCache.width = 0;
+	        this._layoutCache.height = 0;
+	        this._layoutCache._lastComputeOutBounds = { x1: 0, x2: 0, y1: 0, y2: 0 };
+	    }
+	    onDataUpdate() {
+	        this._clearLayoutCache();
+	    }
 	}
 
 	const e10 = Math.sqrt(50);