@visactor/vrender-core 0.16.17-alpha.3 → 0.16.17-alpha.8

package/dist/index.js

@@ -6581,8 +6581,9 @@
     function isMouseLike(pointerType) {
         return pointerType === 'mouse' || pointerType === 'pen';
     }
+    const DEFAULT_CLICK_INTERVAL = 200;
     class EventManager {
-        constructor(root) {
+        constructor(root, config) {
             this.dispatch = new vutils.EventEmitter();
             this.mappingState = {
                 trackingData: {}
@@ -6741,6 +6742,7 @@
                 this.cursor = '';
             };
             this.onPointerUp = (from, target) => {
+                var _a;
                 if (!(from instanceof FederatedPointerEvent)) {
                     console.warn('EventManager cannot map a non-pointer event as a pointer event');
                     return;
@@ -6787,7 +6789,8 @@
                         };
                     }
                     const clickHistory = trackingData.clicksByButton[from.button];
-                    if (clickHistory.target === clickEvent.target && now - clickHistory.timeStamp < 200) {
+                    if (clickHistory.target === clickEvent.target &&
+                        now - clickHistory.timeStamp < ((_a = this._config.clickInterval) !== null && _a !== void 0 ? _a : DEFAULT_CLICK_INTERVAL)) {
                         ++clickHistory.clickCount;
                     }
                     else {
@@ -6846,6 +6849,7 @@
             };
             this.rootTarget = root;
             this.mappingTable = {};
+            this._config = Object.assign({ clickInterval: DEFAULT_CLICK_INTERVAL }, config);
             this.addEventMapping('pointerdown', this.onPointerDown);
             this.addEventMapping('pointermove', this.onPointerMove);
             this.addEventMapping('pointerout', this.onPointerOut);
@@ -7237,8 +7241,10 @@
                 const wheelEvent = this.normalizeWheelEvent(nativeEvent);
                 this.manager.mapEvent(wheelEvent);
             };
-            const { targetElement, resolution, rootNode, global, viewport, autoPreventDefault = false } = params;
-            this.manager = new EventManager(rootNode);
+            const { targetElement, resolution, rootNode, global, viewport, autoPreventDefault = false, clickInterval } = params;
+            this.manager = new EventManager(rootNode, {
+                clickInterval
+            });
             this.globalObj = global;
             this.supportsPointerEvents = global.supportsPointerEvents;
             this.supportsTouchEvents = global.supportsTouchEvents;
@@ -11366,13 +11372,11 @@
     ];
     const GRAPHIC_UPDATE_TAG_KEY = [
         'lineWidth',
-        'lineCap',
-        'lineJoin',
-        'miterLimit',
         'scaleX',
         'scaleY',
         'angle',
-        'anchor'
+        'anchor',
+        'visible'
     ];
     const tempConstantXYKey = ['x', 'y'];
     const tempConstantScaleXYKey = ['scaleX', 'scaleY'];
@@ -15752,9 +15756,7 @@
                 const cacheList = [];
                 path.forEach((item) => {
                     const cache = new CustomPath2D().fromString(item.d);
-                    const attribute = {
-                        fill: 'black'
-                    };
+                    const attribute = {};
                     SVG_PARSE_ATTRIBUTE_MAP_KEYS.forEach(k => {
                         if (item[k]) {
                             attribute[SVG_PARSE_ATTRIBUTE_MAP[k]] = item[k];
@@ -17256,7 +17258,7 @@
         }
         doUpdateFrameCache() {
             var _a;
-            const { textConfig, maxWidth, maxHeight, width, height, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection, singleLine } = this.attribute;
+            const { textConfig = [], maxWidth, maxHeight, width, height, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection, singleLine } = this.attribute;
             const paragraphs = [];
             for (let i = 0; i < textConfig.length; i++) {
                 if ('image' in textConfig[i]) {
@@ -18611,6 +18613,9 @@
             return true;
         }
         updateRectAABBBounds(attribute, rectTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, rectTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 const { width = rectTheme.width, height = rectTheme.height } = attribute;
                 aabbBounds.set(0, 0, width, height);
@@ -18654,12 +18659,18 @@
             return aabbBounds;
         }
         updateGlyphAABBBounds(attribute, theme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, theme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             graphic.getSubGraphic().forEach((node) => {
                 aabbBounds.union(node.AABBBounds);
             });
             return aabbBounds;
         }
         updateRichTextAABBBounds(attribute, richtextTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, richtextTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!graphic) {
                 return aabbBounds;
             }
@@ -18709,6 +18720,9 @@
             return aabbBounds;
         }
         updateTextAABBBounds(attribute, textTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, textTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!graphic) {
                 return aabbBounds;
             }
@@ -18734,6 +18748,9 @@
             return aabbBounds;
         }
         updatePathAABBBounds(attribute, pathTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, pathTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 this.updatePathAABBBoundsImprecise(attribute, pathTheme, aabbBounds, graphic);
             }
@@ -18802,6 +18819,9 @@
             return aabbBounds;
         }
         updatePolygonAABBBounds(attribute, polygonTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, polygonTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 this.updatePolygonAABBBoundsImprecise(attribute, polygonTheme, aabbBounds, graphic);
             }
@@ -18821,6 +18841,9 @@
             return aabbBounds;
         }
         updateLineAABBBounds(attribute, lineTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, lineTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 attribute.segments
                     ? this.updateLineAABBBoundsBySegments(attribute, lineTheme, aabbBounds, graphic)
@@ -18853,6 +18876,9 @@
             return b;
         }
         updateAreaAABBBounds(attribute, areaTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, areaTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 attribute.segments
                     ? this.updateAreaAABBBoundsBySegments(attribute, areaTheme, aabbBounds, graphic)
@@ -18889,6 +18915,9 @@
             return b;
         }
         updateCircleAABBBounds(attribute, circleTheme, aabbBounds, full, graphic) {
+            if (!this._validCheck(attribute, circleTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 full
                     ? this.updateCircleAABBBoundsImprecise(attribute, circleTheme, aabbBounds, graphic)
@@ -18926,6 +18955,9 @@
             return aabbBounds;
         }
         updateArcAABBBounds(attribute, arcTheme, aabbBounds, full, graphic) {
+            if (!this._validCheck(attribute, arcTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 full
                     ? this.updateArcAABBBoundsImprecise(attribute, arcTheme, aabbBounds, graphic)
@@ -18979,6 +19011,9 @@
             return aabbBounds;
         }
         updateSymbolAABBBounds(attribute, symbolTheme, aabbBounds, full, graphic) {
+            if (!this._validCheck(attribute, symbolTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 full
                     ? this.updateSymbolAABBBoundsImprecise(attribute, symbolTheme, aabbBounds, graphic)
@@ -19022,6 +19057,9 @@
             return aabbBounds;
         }
         updateImageAABBBounds(attribute, imageTheme, aabbBounds, graphic) {
+            if (!this._validCheck(attribute, imageTheme, aabbBounds, graphic)) {
+                return aabbBounds;
+            }
             if (!this.updatePathProxyAABBBounds(aabbBounds, graphic)) {
                 const { width = imageTheme.width, height = imageTheme.height } = attribute;
                 aabbBounds.set(0, 0, width, height);
@@ -19057,6 +19095,21 @@
             this.combindShadowAABBBounds(aabbBounds, graphic);
             vutils.transformBoundsWithMatrix(aabbBounds, aabbBounds, graphic.transMatrix);
         }
+        _validCheck(attribute, theme, aabbBounds, graphic) {
+            if (!graphic) {
+                return true;
+            }
+            if (!graphic.valid) {
+                aabbBounds.clear();
+                return false;
+            }
+            const { visible = theme.visible } = attribute;
+            if (!visible) {
+                aabbBounds.clear();
+                return false;
+            }
+            return true;
+        }
     };
     exports.DefaultGraphicService = __decorate([
         injectable(),
@@ -20910,12 +20963,21 @@
                 const camera = context.camera;
                 context.camera = null;
                 if (parsedPath.draw(context, size, p.x, p.y, undefined, (p, a) => {
+                    var _a, _b, _c;
+                    if (symbol._parsedPath.svgCache) {
+                        const obj = Object.assign({}, a);
+                        obj.fill = (_a = a.fill) !== null && _a !== void 0 ? _a : symbol.attribute.fill;
+                        obj.opacity = (_b = a.fill) !== null && _b !== void 0 ? _b : symbol.attribute.opacity;
+                        obj.fillOpacity = symbol.attribute.fillOpacity;
+                        obj.stroke = (_c = a.stroke) !== null && _c !== void 0 ? _c : symbol.attribute.stroke;
+                        a = obj;
+                    }
                     if (a.fill) {
                         if (fillCb) {
                             fillCb(context, symbol.attribute, symbolAttribute);
                         }
                         else {
-                            context.setCommonStyle(symbol, a, originX - x, originY - y);
+                            context.setCommonStyle(symbol, a, originX - x, originY - y, symbolAttribute);
                             context.fill();
                         }
                     }
@@ -20924,7 +20986,7 @@
                             strokeCb(context, symbol.attribute, symbolAttribute);
                         }
                         else {
-                            context.setStrokeStyle(symbol, a, (originX - x) / scaleX, (originY - y) / scaleY);
+                            context.setStrokeStyle(symbol, a, (originX - x) / scaleX, (originY - y) / scaleY, symbolAttribute);
                             context.stroke();
                         }
                     }
@@ -20935,12 +20997,21 @@
             }
             else {
                 if (parsedPath.draw(context, size, x, y, z, (p, a) => {
+                    var _a, _b, _c;
+                    if (symbol._parsedPath.svgCache) {
+                        const obj = Object.assign({}, a);
+                        obj.fill = (_a = a.fill) !== null && _a !== void 0 ? _a : symbol.attribute.fill;
+                        obj.opacity = (_b = a.opacity) !== null && _b !== void 0 ? _b : symbol.attribute.opacity;
+                        obj.fillOpacity = symbol.attribute.fillOpacity;
+                        obj.stroke = (_c = a.stroke) !== null && _c !== void 0 ? _c : symbol.attribute.stroke;
+                        a = obj;
+                    }
                     if (a.fill) {
                         if (fillCb) {
                             fillCb(context, symbol.attribute, symbolAttribute);
                         }
                         else {
-                            context.setCommonStyle(symbol, a, originX - x, originY - y);
+                            context.setCommonStyle(symbol, a, originX - x, originY - y, symbolAttribute);
                             context.fill();
                         }
                     }
@@ -20949,7 +21020,7 @@
                             strokeCb(context, symbol.attribute, symbolAttribute);
                         }
                         else {
-                            context.setStrokeStyle(symbol, a, (originX - x) / scaleX, (originY - y) / scaleY);
+                            context.setStrokeStyle(symbol, a, (originX - x) / scaleX, (originY - y) / scaleY, symbolAttribute);
                             context.stroke();
                         }
                     }
@@ -21444,7 +21515,9 @@
                     if (repeat) {
                         const pattern = context.createPattern(res.data, repeatStr[repeat]);
                         context.fillStyle = pattern;
-                        context.fillRect(x, y, width, height);
+                        context.translate(x, y, true);
+                        context.fillRect(0, 0, width, height);
+                        context.translate(-x, -y, true);
                     }
                     else {
                         context.drawImage(res.data, x, y, width, height);
@@ -22761,6 +22834,7 @@
                 }
                 context.camera = null;
                 pickParams.in3dInterceptor = false;
+                context.restore();
                 return result;
             }
             context.restore();
@@ -26225,12 +26299,7 @@
             this.stage = this;
             this.renderStyle = params.renderStyle;
             if (this.global.supportEvent) {
-                this.eventSystem = new EventSystem({
-                    targetElement: this.window,
-                    resolution: this.window.dpr || this.global.devicePixelRatio,
-                    rootNode: this,
-                    global: this.global,
-                    viewport: {
+                this.eventSystem = new EventSystem(Object.assign({ targetElement: this.window, resolution: this.window.dpr || this.global.devicePixelRatio, rootNode: this, global: this.global, viewport: {
                         viewBox: this._viewBox,
                         get x() {
                             return this.viewBox.x1;
@@ -26244,8 +26313,7 @@
                         get height() {
                             return this.viewBox.height();
                         }
-                    }
-                });
+                    } }, params.event));
             }
             if (params.autoRender) {
                 this.enableAutoRender();
@@ -26267,7 +26335,7 @@
             this.ticker.addTimeline(this.timeline);
             this.timeline.pause();
             this.optmize(params.optimize);
-            if (this._background && vutils.isString(this._background)) {
+            if (params.background && vutils.isString(this._background) && this._background.includes('/')) {
                 this.setAttributes({ background: this._background });
             }
         }