@visactor/vrender 0.15.2 → 0.15.3-alpha.0

package/dist/index.js

@@ -9371,7 +9371,8 @@
 	    scaleIn3d: false,
 	    direction: 'horizontal',
 	    wordBreak: 'break-all',
-	    ignoreBuf: false
+	    ignoreBuf: false,
+	    verticalMode: 0
 	};
 	const DefaultStyle = Object.assign(Object.assign(Object.assign({ opacity: 1, background: null, texture: null, textureColor: 'black', textureSize: 10, texturePadding: 2, backgroundMode: 0, blur: 0, cursor: null, html: null }, DefaultFillStyle), DefaultStrokeStyle), DefaultLayout);
 	const DefaultConnectAttribute = {
@@ -9380,7 +9381,10 @@
 	    connectedX: NaN,
 	    connectedY: NaN
 	};
-	const DefaultAttribute = Object.assign(Object.assign({ strokeSeg: null, pickable: true, childrenPickable: true, visible: true, zIndex: 0, layout: null, boundsPadding: 0, pickMode: 'accurate', customPickShape: null, boundsMode: 'accurate', keepDirIn3d: true, shadowRootIdx: 1 }, DefaultStyle), DefaultTransform);
+	const DefaultDebugAttribute = {
+	    _debug_bounds: false
+	};
+	const DefaultAttribute = Object.assign(Object.assign(Object.assign({ strokeSeg: null, pickable: true, childrenPickable: true, visible: true, zIndex: 0, layout: null, boundsPadding: 0, pickMode: 'accurate', customPickShape: null, boundsMode: 'accurate', keepDirIn3d: true, shadowRootIdx: 1 }, DefaultDebugAttribute), DefaultStyle), DefaultTransform);
 	function addAttributeToPrototype(obj, c, keys) {
 	    keys.forEach(key => {
 	        c.prototype[key] = obj[key];
@@ -10980,11 +10984,11 @@
 	    forEach(cb) {
 	        return this.forEachChildren(cb);
 	    }
-	    appendChild(node) {
+	    appendChild(node, highPerformance = true) {
 	        if (this._uid === node._uid) {
 	            return null;
 	        }
-	        if (node.isAncestorsOf(this)) {
+	        if (!highPerformance && node.isAncestorsOf(this)) {
 	            throw new Error('【Node::appendChild】不能将父辈元素append为子元素');
 	        }
 	        node.parent && node.parent.removeChild(node);
@@ -18087,6 +18091,7 @@
 	    }
 	    release() {
 	        this.releaseStatus = 'released';
+	        application.graphicService.onRelease(this);
 	    }
 	    _emitCustomEvent(type, context) {
 	        var _a, _b;
@@ -21006,7 +21011,7 @@
 	                context.arc(cx, cy, outerRadius, outerStartAngle, outerEndAngle, !clockwise);
 	            }
 	            else {
-	                context.moveTo(cx + outerRadius * cos(outerEndAngle), cy + (yore !== null && yore !== void 0 ? yore : 0));
+	                context.moveTo(cx + outerRadius * cos(outerEndAngle), cy + outerRadius * sin(outerEndAngle));
 	            }
 	        }
 	        if (!(innerRadius > epsilon) || innerDeltaAngle < 0.001) {
@@ -22089,15 +22094,27 @@
 	        }
 	        return this._AABBBounds;
 	    }
+	    getBaselineMapAlign() {
+	        return Text.baselineMapAlign;
+	    }
+	    getAlignMapBaseline() {
+	        return Text.alignMapBaseline;
+	    }
 	    updateVerticalSinglelineAABBBounds(text) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textTheme = getTheme(this).text;
 	        const textMeasure = application.graphicUtil.textMeasure;
 	        let width;
 	        const attribute = this.attribute;
 	        const { ignoreBuf = textTheme.ignoreBuf } = attribute;
 	        const buf = ignoreBuf ? 0 : 2;
-	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, fontFamily = textTheme.fontFamily, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak } = attribute;
+	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, fontFamily = textTheme.fontFamily, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, verticalMode = textTheme.verticalMode } = attribute;
+	        let { textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline } = attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_b = Text.baselineMapAlign[textBaseline]) !== null && _b !== void 0 ? _b : 'left';
+	            textBaseline = (_c = Text.alignMapBaseline[t]) !== null && _c !== void 0 ? _c : 'top';
+	        }
 	        if (!this.shouldUpdateShape() && this.cache) {
 	            width = this.cache.clipedWidth;
 	            const dx = textDrawOffsetX(textAlign, width);
@@ -22173,14 +22190,20 @@
 	        return this._AABBBounds;
 	    }
 	    updateVerticalMultilineAABBBounds(text) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textTheme = getTheme(this).text;
 	        const textMeasure = application.graphicUtil.textMeasure;
 	        let width;
 	        const attribute = this.attribute;
 	        const { ignoreBuf = textTheme.ignoreBuf } = attribute;
 	        const buf = ignoreBuf ? 0 : 2;
-	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak } = attribute;
+	        const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf, lineWidth = textTheme.lineWidth, verticalMode = textTheme.verticalMode } = attribute;
+	        let { textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline } = attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_b = Text.baselineMapAlign[textBaseline]) !== null && _b !== void 0 ? _b : 'left';
+	            textBaseline = (_c = Text.alignMapBaseline[t]) !== null && _c !== void 0 ? _c : 'top';
+	        }
 	        width = 0;
 	        if (!this.shouldUpdateShape() && this.cache) {
 	            this.cache.verticalList.forEach(item => {
@@ -22272,6 +22295,16 @@
 	    }
 	}
 	Text.NOWORK_ANIMATE_ATTR = Object.assign({ ellipsis: 1, wordBreak: 1, direction: 1, textAlign: 1, textBaseline: 1, fontFamily: 1, fontWeight: 1 }, NOWORK_ANIMATE_ATTR);
+	Text.baselineMapAlign = {
+	    top: 'left',
+	    bottom: 'right',
+	    middle: 'center'
+	};
+	Text.alignMapBaseline = {
+	    left: 'top',
+	    right: 'bottom',
+	    center: 'middle'
+	};
 
 	const WRAP_TEXT_UPDATE_TAG_KEY = ['heightLimit', 'lineClamp'];
 	class WrapText extends Text {
@@ -26206,6 +26239,7 @@
 	            onAttributeUpdate: new SyncHook(['graphic']),
 	            onSetStage: new SyncHook(['graphic', 'stage']),
 	            onRemove: new SyncHook(['graphic']),
+	            onRelease: new SyncHook(['graphic']),
 	            onAddIncremental: new SyncHook(['graphic', 'group', 'stage']),
 	            onClearIncremental: new SyncHook(['graphic', 'group', 'stage']),
 	            beforeUpdateAABBBounds: new SyncHook([
@@ -26240,6 +26274,11 @@
 	            this.hooks.onRemove.call(graphic);
 	        }
 	    }
+	    onRelease(graphic) {
+	        if (this.hooks.onRelease.taps.length) {
+	            this.hooks.onRelease.call(graphic);
+	        }
+	    }
 	    onAddIncremental(graphic, group, stage) {
 	        if (this.hooks.onAddIncremental.taps.length) {
 	            this.hooks.onAddIncremental.call(graphic, group, stage);
@@ -28492,10 +28531,16 @@
 	        this.numberType = TEXT_NUMBER_TYPE;
 	    }
 	    drawShape(text, context, x, y, drawContext, params, fillCb, strokeCb) {
-	        var _a;
+	        var _a, _b, _c;
 	        const textAttribute = getTheme(text, params === null || params === void 0 ? void 0 : params.theme).text;
-	        const { text: str, fill = textAttribute.fill, stroke = textAttribute.stroke, fillOpacity = textAttribute.fillOpacity, strokeOpacity = textAttribute.strokeOpacity, opacity = textAttribute.opacity, lineWidth = textAttribute.lineWidth, visible = textAttribute.visible, underline = textAttribute.underline, lineThrough = textAttribute.lineThrough, keepDirIn3d = textAttribute.keepDirIn3d, direction = textAttribute.direction, fontSize = textAttribute.fontSize, textBaseline = textAttribute.textBaseline, textAlign = textAttribute.textAlign, x: originX = textAttribute.x, y: originY = textAttribute.y } = text.attribute;
-	        const lineHeight = (_a = text.attribute.lineHeight) !== null && _a !== void 0 ? _a : fontSize;
+	        const { text: str, fill = textAttribute.fill, stroke = textAttribute.stroke, fillOpacity = textAttribute.fillOpacity, strokeOpacity = textAttribute.strokeOpacity, opacity = textAttribute.opacity, lineWidth = textAttribute.lineWidth, visible = textAttribute.visible, underline = textAttribute.underline, lineThrough = textAttribute.lineThrough, keepDirIn3d = textAttribute.keepDirIn3d, direction = textAttribute.direction, fontSize = textAttribute.fontSize, verticalMode = textAttribute.verticalMode, x: originX = textAttribute.x, y: originY = textAttribute.y } = text.attribute;
+	        let { textAlign = textAttribute.textAlign, textBaseline = textAttribute.textBaseline } = text.attribute;
+	        if (!verticalMode) {
+	            const t = textAlign;
+	            textAlign = (_a = text.getBaselineMapAlign()[textBaseline]) !== null && _a !== void 0 ? _a : 'left';
+	            textBaseline = (_b = text.getAlignMapBaseline()[t]) !== null && _b !== void 0 ? _b : 'top';
+	        }
+	        const lineHeight = (_c = text.attribute.lineHeight) !== null && _c !== void 0 ? _c : fontSize;
 	        const fVisible = fillVisible(opacity, fillOpacity, fill);
 	        const sVisible = strokeVisible(opacity, strokeOpacity);
 	        const doFill = runFill(fill);
@@ -30186,21 +30231,21 @@
 	        if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {
 	            return this._pickItem(graphic, pickerService, point, pickParams, params);
 	        }
-	        return false;
+	        return null;
 	    }
 	    beforePickItem(graphic, pickerService, point, pickParams, params) {
 	        if (graphic.attribute.shadowRootIdx < 0) {
 	            return this._pickItem(graphic, pickerService, point, pickParams, params);
 	        }
-	        return false;
+	        return null;
 	    }
 	    _pickItem(graphic, pickerService, point, pickParams, params) {
 	        if (!graphic.shadowRoot) {
-	            return false;
+	            return null;
 	        }
 	        const { parentMatrix } = params || {};
 	        if (!parentMatrix) {
-	            return false;
+	            return null;
 	        }
 	        const context = pickerService.pickContext;
 	        context.highPerformanceSave();
@@ -30384,7 +30429,7 @@
 	                result = this.pickGroup(graphics[i], point, parentMatrix, params);
 	            }
 	            else {
-	                result.graphic = this.pickItem(graphics[i], point, parentMatrix, params);
+	                result = this.pickItem(graphics[i], point, parentMatrix, params);
 	            }
 	            if (result.graphic) {
 	                break;
@@ -30466,12 +30511,13 @@
 	            return result;
 	        }
 	        const pickedItem = this.pickItem(group, newPoint.clone(), parentMatrix, params);
-	        if (pickedItem) {
-	            result.graphic = pickedItem;
+	        if (pickedItem && pickedItem.graphic) {
+	            result.graphic = pickedItem.graphic;
+	            result.params = pickedItem.params;
 	        }
 	        const groupPicked = group.attribute.pickable !== false && insideGroup;
 	        currentGroupMatrix.multiply(transMatrix.a, transMatrix.b, transMatrix.c, transMatrix.d, transMatrix.e, transMatrix.f);
-	        if (group.attribute.childrenPickable !== false && !pickedItem) {
+	        if (group.attribute.childrenPickable !== false && !(pickedItem && pickedItem.graphic)) {
 	            foreach(group, DefaultAttribute.zIndex, (graphic) => {
 	                if (graphic.isContainer) {
 	                    const newPoint = new Point(point.x, point.y);
@@ -30489,7 +30535,10 @@
 	                    newPoint.x -= scrollX;
 	                    newPoint.y -= scrollY;
 	                    const pickedItem = this.pickItem(graphic, newPoint, parentMatrix, params);
-	                    result.graphic = pickedItem;
+	                    if (pickedItem && pickedItem.graphic) {
+	                        result.graphic = pickedItem.graphic;
+	                        result.params = pickedItem.params;
+	                    }
 	                }
 	                return !!result.graphic || !!result.group;
 	            }, true, !!context.camera);
@@ -30544,7 +30593,11 @@
 	                result = this.pickGroup(graphics[i], point, parentMatrix, params);
 	            }
 	            else {
-	                result.graphic = this.pickItem(graphics[i], point, parentMatrix, params);
+	                const data = this.pickItem(graphics[i], point, parentMatrix, params);
+	                if (data) {
+	                    result.graphic = data.graphic;
+	                    result.params = data.params;
+	                }
 	            }
 	            if (result.graphic) {
 	                break;
@@ -30598,7 +30651,11 @@
 	                else {
 	                    const newPoint = new Point(point.x, point.y);
 	                    parentMatrix.transformPoint(newPoint, newPoint);
-	                    result.graphic = this.pickItem(graphic, newPoint, parentMatrix, params);
+	                    const data = this.pickItem(graphic, newPoint, parentMatrix, params);
+	                    if (data) {
+	                        result.graphic = data.graphic;
+	                        result.params = data.params;
+	                    }
 	                }
 	                return !!result.graphic || !!result.group;
 	            });
@@ -30613,7 +30670,9 @@
 	            return null;
 	        }
 	        if (graphic.AABBBounds.containsPoint(point)) {
-	            return graphic;
+	            return {
+	                graphic: graphic
+	            };
 	        }
 	        return null;
 	    }
@@ -31898,7 +31957,7 @@
 	                if (drawContribution.beforePickItem) {
 	                    const ret = drawContribution.beforePickItem(graphic, this, point, params, { parentMatrix });
 	                    if (ret) {
-	                        return ret === true ? graphic : ret.graphic;
+	                        return ret;
 	                    }
 	                }
 	            }
@@ -31907,8 +31966,11 @@
 	        if (!picker) {
 	            return null;
 	        }
-	        const data = picker.contains(graphic, point, params) ? graphic : null;
-	        if (data) {
+	        const g = picker.contains(graphic, point, params) ? graphic : null;
+	        const data = {
+	            graphic: g
+	        };
+	        if (g) {
 	            return data;
 	        }
 	        if (this.InterceptorContributions.length) {
@@ -31917,7 +31979,7 @@
 	                if (drawContribution.afterPickItem) {
 	                    const ret = drawContribution.afterPickItem(graphic, this, point, params, { parentMatrix });
 	                    if (ret) {
-	                        return ret === true ? graphic : ret.graphic;
+	                        return ret;
 	                    }
 	                }
 	            }
@@ -32235,7 +32297,13 @@
 	        if (!picker) {
 	            return null;
 	        }
-	        return picker.contains(graphic, point, params) ? graphic : null;
+	        const g = picker.contains(graphic, point, params) ? graphic : null;
+	        if (g) {
+	            return {
+	                graphic: g
+	            };
+	        }
+	        return null;
 	    }
 	};
 	__decorate([
@@ -35617,6 +35685,40 @@
 	ShadowRootDrawItemInterceptorContribution = __decorate([
 	    injectable()
 	], ShadowRootDrawItemInterceptorContribution);
+	let CommonDrawItemInterceptorContribution = class CommonDrawItemInterceptorContribution {
+	    constructor() {
+	        this.order = 1;
+	    }
+	    afterDrawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {
+	            this.drawItem(graphic, renderService, drawContext, drawContribution, params);
+	        }
+	        return false;
+	    }
+	    beforeDrawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (graphic.attribute.shadowRootIdx < 0) {
+	            this.drawItem(graphic, renderService, drawContext, drawContribution, params);
+	        }
+	        return false;
+	    }
+	    drawItem(graphic, renderService, drawContext, drawContribution, params) {
+	        if (!graphic.attribute._debug_bounds) {
+	            return false;
+	        }
+	        const { context } = drawContext;
+	        context.highPerformanceSave();
+	        const b = graphic.AABBBounds;
+	        if (graphic.attribute._debug_bounds !== true) {
+	            graphic.attribute._debug_bounds(context, graphic);
+	        }
+	        context.strokeRect(b.x1, b.y1, b.width(), b.height());
+	        context.highPerformanceRestore();
+	        return true;
+	    }
+	};
+	CommonDrawItemInterceptorContribution = __decorate([
+	    injectable()
+	], CommonDrawItemInterceptorContribution);
 	let Canvas3DDrawItemInterceptor = class Canvas3DDrawItemInterceptor {
 	    constructor() {
 	        this.order = 1;
@@ -37379,6 +37481,8 @@
 	    bindContributionProvider(bind, GraphicRender);
 	    bind(ShadowRootDrawItemInterceptorContribution).toSelf().inSingletonScope();
 	    bind(DrawItemInterceptor).toService(ShadowRootDrawItemInterceptorContribution);
+	    bind(CommonDrawItemInterceptorContribution).toSelf().inSingletonScope();
+	    bind(DrawItemInterceptor).toService(CommonDrawItemInterceptorContribution);
 	    bind(Canvas3DDrawItemInterceptor).toSelf().inSingletonScope();
 	    bind(DrawItemInterceptor).toService(Canvas3DDrawItemInterceptor);
 	    bindContributionProvider(bind, DrawItemInterceptor);
@@ -37482,6 +37586,7 @@
 	        }
 	        let picked = true;
 	        if (!onlyTranslate ||
+	            rect.shadowRoot ||
 	            (isNumber$2(cornerRadius, true) && cornerRadius !== 0) ||
 	            (isArray$1(cornerRadius) && cornerRadius.some(num => num !== 0))) {
 	            picked = false;
@@ -37501,7 +37606,7 @@
 	                return picked;
 	            });
 	        }
-	        else if (picked) {
+	        else {
 	            const { fill = rectAttribute.fill, stroke = rectAttribute.stroke, lineWidth = rectAttribute.lineWidth } = rect.attribute;
 	            if (fill) {
 	                picked = true;
@@ -39088,6 +39193,9 @@
 	            }
 	            this.drawHTML(context.stage.renderService);
 	        });
+	        application.graphicService.hooks.onRelease.tap(this.key, graphic => {
+	            this.removeDom(graphic);
+	        });
 	    }
 	    deactivate(context) {
 	        context.stage.hooks.afterRender.taps = context.stage.hooks.afterRender.taps.filter(item => {
@@ -39117,6 +39225,14 @@
 	            }
 	        });
 	    }
+	    removeDom(graphic) {
+	        if (graphic.bindDom && graphic.bindDom.size) {
+	            graphic.bindDom.forEach(item => {
+	                item.dom && item.dom.parentElement.removeChild(item.dom);
+	            });
+	            graphic.bindDom.clear();
+	        }
+	    }
 	    renderGraphicHTML(graphic) {
 	        const { html } = graphic.attribute;
 	        if (!html) {
@@ -40381,7 +40497,7 @@
 	}
 	const Fragment = Group;
 
-	const version = "0.15.2";
+	const version = "0.15.3-alpha.0";
 
 	exports.ACustomAnimate = ACustomAnimate;
 	exports.ARC3D_NUMBER_TYPE = ARC3D_NUMBER_TYPE;
@@ -40427,6 +40543,7 @@
 	exports.DefaultAttribute = DefaultAttribute;
 	exports.DefaultCircleAttribute = DefaultCircleAttribute;
 	exports.DefaultConnectAttribute = DefaultConnectAttribute;
+	exports.DefaultDebugAttribute = DefaultDebugAttribute;
 	exports.DefaultFillStyle = DefaultFillStyle;
 	exports.DefaultGlyphAttribute = DefaultGlyphAttribute;
 	exports.DefaultGroupAttribute = DefaultGroupAttribute;