@visactor/vrender-components 1.0.0-alpha.17 → 1.0.0-alpha.19

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { tau, halfPi as halfPi$1, AABBBounds, degreeToRadian, Point, PointService, abs, max, min, atan2, epsilon, Matrix, pi2, Logger, pi, isArray, isPointInLine, isNumberClose, TextMeasure, EventEmitter, isBoolean, isObject, isFunction, cos, sin, isString, pointAt, isNumber, sqrt, Color, OBBBounds, isNil, normalTransform, isValidUrl, isBase64, acos, transformBoundsWithMatrix, getContextFont, rotatePoint, clampAngleByRadian, asin, arrayEqual, Bounds, getRectIntersect, isRectIntersect, isEqual, isPlainObject, merge, clamp, clampRange, normalizePadding, debounce, throttle, hexToRgb, crossProduct, isValid, isEmpty, array, rectInsideAnotherRect, radianToDegree, getAngleByPoint, polarToCartesian, normalizeAngle, isValidNumber, flattenArray, isRotateAABBIntersect, isLess, isGreater, aabbSeparation, obbSeparation, cloneDeep, get, last, mixin, interpolateString, minInArray, maxInArray, binaryFuzzySearchInNumberRange, pointInRect, calculateAnchorOfBounds, computeQuadrant, polygonContainPoint } from '@visactor/vutils';
+import { tau, halfPi as halfPi$1, AABBBounds, degreeToRadian, Point, PointService, abs, max, min, atan2, epsilon, Matrix, pi2, Logger, pi, isArray, isPointInLine, isNumberClose, TextMeasure, EventEmitter, isBoolean, isObject, isFunction, cos, sin, isString, pointAt, isNumber, sqrt, Color, OBBBounds, isNil, normalTransform, isValidUrl, isBase64, acos, transformBoundsWithMatrix, getContextFont, rotatePoint, clampAngleByRadian, asin, arrayEqual, Bounds, getRectIntersect, isRectIntersect, isEqual, isPlainObject, merge, isValid, clamp, clampRange, normalizePadding, debounce, throttle, hexToRgb, crossProduct, isEmpty, array, rectInsideAnotherRect, radianToDegree, getAngleByPoint, polarToCartesian, normalizeAngle, isValidNumber, flattenArray, isRotateAABBIntersect, isLess, isGreater, aabbSeparation, obbSeparation, cloneDeep, get, last, mixin, interpolateString, minInArray, maxInArray, binaryFuzzySearchInNumberRange, pointInRect, calculateAnchorOfBounds, computeQuadrant, polygonContainPoint } from '@visactor/vutils';
 import { isContinuous, isDiscrete, LinearScale } from '@visactor/vscale';
 
 class Generator {
@@ -489,11 +489,14 @@ class Container {
 const ContributionProvider = Symbol("ContributionProvider");
 class ContributionProviderCache {
   constructor(serviceIdentifier, container) {
-    this.serviceIdentifier = serviceIdentifier, this.container = container;
+    this.serviceIdentifier = serviceIdentifier, this.container = container, ContributionStore.setStore(this.serviceIdentifier, this);
   }
   getContributions() {
     return this.caches || (this.caches = [], this.container && this.container.isBound(this.serviceIdentifier) && this.caches.push(...this.container.getAll(this.serviceIdentifier))), this.caches;
   }
+  refresh() {
+    this.caches && (this.caches.length = 0, this.container && this.container.isBound(this.serviceIdentifier) && this.caches.push(...this.container.getAll(this.serviceIdentifier)));
+  }
 }
 function bindContributionProvider(bind, id) {
   bind(ContributionProvider).toDynamicValue(_ref => {
@@ -511,6 +514,20 @@ function bindContributionProviderNoSingletonScope(bind, id) {
     return new ContributionProviderCache(id, container);
   }).whenTargetNamed(id);
 }
+class ContributionStore {
+  static getStore(id) {
+    return this.store.get(id);
+  }
+  static setStore(id, cache) {
+    this.store.set(id, cache);
+  }
+  static refreshAllContributions() {
+    this.store.forEach(cache => {
+      cache.refresh();
+    });
+  }
+}
+ContributionStore.store = new Map();
 
 class Hook {
   constructor(args, name) {
@@ -592,10 +609,52 @@ class PerformanceRAF {
     };
   }
   addAnimationFrameCb(callback) {
-    return this.nextAnimationFrameCbs.push(callback), this.tryRunAnimationFrameNextFrame(), this.nextAnimationFrameCbs.length - 1;
+    return this.nextAnimationFrameCbs.push(callback), this.tryRunAnimationFrameNextFrame(), this.nextAnimationFrameCbs.length;
   }
   removeAnimationFrameCb(index) {
-    return index >= 0 && index < this.nextAnimationFrameCbs.length && (this.nextAnimationFrameCbs[index] = null, !0);
+    return index > 0 && index <= this.nextAnimationFrameCbs.length && (this.nextAnimationFrameCbs[index - 1] = null, !0);
+  }
+}
+
+class EventListenerManager {
+  constructor() {
+    this._listenerMap = new Map(), this._eventListenerTransformer = event => event;
+  }
+  setEventListenerTransformer(transformer) {
+    this._eventListenerTransformer = transformer || (event => event);
+  }
+  addEventListener(type, listener, options) {
+    if (!listener) return;
+    const wrappedListener = event => {
+      const transformedEvent = this._eventListenerTransformer(event);
+      "function" == typeof listener ? listener(transformedEvent) : listener.handleEvent && listener.handleEvent(transformedEvent);
+    };
+    this._listenerMap.has(type) || this._listenerMap.set(type, new Map()), this._listenerMap.get(type).set(listener, wrappedListener), this._nativeAddEventListener(type, wrappedListener, options);
+  }
+  removeEventListener(type, listener, options) {
+    var _a;
+    if (!listener) return;
+    const wrappedListener = null === (_a = this._listenerMap.get(type)) || void 0 === _a ? void 0 : _a.get(listener);
+    wrappedListener && (this._nativeRemoveEventListener(type, wrappedListener, options), this._listenerMap.get(type).delete(listener), 0 === this._listenerMap.get(type).size && this._listenerMap.delete(type));
+  }
+  dispatchEvent(event) {
+    return this._nativeDispatchEvent(event);
+  }
+  clearAllEventListeners() {
+    this._listenerMap.forEach((listenersMap, type) => {
+      listenersMap.forEach((wrappedListener, originalListener) => {
+        this._nativeRemoveEventListener(type, wrappedListener, void 0);
+      });
+    }), this._listenerMap.clear();
+  }
+  _nativeAddEventListener(type, listener, options) {
+    throw new Error("_nativeAddEventListener must be implemented by derived classes");
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    throw new Error("_nativeRemoveEventListener must be implemented by derived classes");
+  }
+  _nativeDispatchEvent(event) {
+    throw new Error("_nativeDispatchEvent must be implemented by derived classes");
   }
 }
 
@@ -639,7 +698,7 @@ var __decorate$Q = undefined && undefined.__decorate || function (decorators, ta
       step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
   };
-let DefaultGlobal = class {
+let DefaultGlobal = class extends EventListenerManager {
   get env() {
     return this._env;
   }
@@ -683,10 +742,19 @@ let DefaultGlobal = class {
     this._env || this.setEnv("browser"), this.envContribution.applyStyles = support;
   }
   constructor(contributions) {
-    this.contributions = contributions, this._isImageAnonymous = !0, this._performanceRAFList = [], this.id = Generator.GenAutoIncrementId(), this.hooks = {
+    super(), this.contributions = contributions, this._isImageAnonymous = !0, this._performanceRAFList = [], this.eventListenerTransformer = event => event, this.id = Generator.GenAutoIncrementId(), this.hooks = {
       onSetEnv: new SyncHook(["lastEnv", "env", "global"])
     }, this.measureTextMethod = "native", this.optimizeVisible = !1;
   }
+  _nativeAddEventListener(type, listener, options) {
+    return this._env || this.setEnv("browser"), this.envContribution.addEventListener(type, listener, options);
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    return this._env || this.setEnv("browser"), this.envContribution.removeEventListener(type, listener, options);
+  }
+  _nativeDispatchEvent(event) {
+    return this._env || this.setEnv("browser"), this.envContribution.dispatchEvent(event);
+  }
   bindContribution(params) {
     const promiseArr = [];
     if (this.contributions.getContributions().forEach(contribution => {
@@ -727,15 +795,6 @@ let DefaultGlobal = class {
   releaseCanvas(canvas) {
     return this._env || this.setEnv("browser"), this.envContribution.releaseCanvas(canvas);
   }
-  addEventListener(type, listener, options) {
-    return this._env || this.setEnv("browser"), this.envContribution.addEventListener(type, listener, options);
-  }
-  removeEventListener(type, listener, options) {
-    return this._env || this.setEnv("browser"), this.envContribution.removeEventListener(type, listener, options);
-  }
-  dispatchEvent(event) {
-    return this._env || this.setEnv("browser"), this.envContribution.dispatchEvent(event);
-  }
   getRequestAnimationFrame() {
     return this._env || this.setEnv("browser"), this.envContribution.getRequestAnimationFrame();
   }
@@ -3789,7 +3848,7 @@ var __decorate$N = undefined && undefined.__decorate || function (decorators, ta
   };
 const VWindow = Symbol.for("VWindow");
 const WindowHandlerContribution = Symbol.for("WindowHandlerContribution");
-let DefaultWindow = class {
+let DefaultWindow = class extends EventListenerManager {
   get width() {
     if (this._handler) {
       const wh = this._handler.getWH();
@@ -3808,7 +3867,7 @@ let DefaultWindow = class {
     return this._handler.getDpr();
   }
   constructor() {
-    this.hooks = {
+    super(), this.hooks = {
       onChange: new SyncHook(["x", "y", "width", "height"])
     }, this.active = () => {
       const global = this.global;
@@ -3816,6 +3875,15 @@ let DefaultWindow = class {
       container.getNamed(WindowHandlerContribution, global.env).configure(this, global), this.actived = !0;
     }, this._uid = Generator.GenAutoIncrementId(), this.global = application.global, this.postInit();
   }
+  _nativeAddEventListener(type, listener, options) {
+    return this._handler.addEventListener(type, listener, options);
+  }
+  _nativeRemoveEventListener(type, listener, options) {
+    return this._handler.removeEventListener(type, listener, options);
+  }
+  _nativeDispatchEvent(event) {
+    return this._handler.dispatchEvent(event);
+  }
   postInit() {
     this.global.hooks.onSetEnv.tap("window", this.active), this.active();
   }
@@ -3855,7 +3923,7 @@ let DefaultWindow = class {
     throw new Error("暂不支持");
   }
   release() {
-    return this.global.hooks.onSetEnv.unTap("window", this.active), this._handler.releaseWindow();
+    return this.global.hooks.onSetEnv.unTap("window", this.active), this.clearAllEventListeners(), this._handler.releaseWindow();
   }
   getContext() {
     return this._handler.getContext();
@@ -3866,15 +3934,6 @@ let DefaultWindow = class {
   getImageBuffer(type) {
     return this._handler.getImageBuffer ? this._handler.getImageBuffer(type) : null;
   }
-  addEventListener(type, listener, options) {
-    return this._handler.addEventListener(type, listener, options);
-  }
-  removeEventListener(type, listener, options) {
-    return this._handler.removeEventListener(type, listener, options);
-  }
-  dispatchEvent(event) {
-    return this._handler.dispatchEvent(event);
-  }
   getBoundingClientRect() {
     return this._handler.getBoundingClientRect();
   }
@@ -10848,6 +10907,9 @@ class BaseRender {
   init(contributions) {
     contributions && (this._renderContribitions = contributions.getContributions()), this._renderContribitions || (this._renderContribitions = []), this.builtinContributions || (this.builtinContributions = []), this.builtinContributions.push(defaultBaseClipRenderBeforeContribution), this.builtinContributions.push(defaultBaseClipRenderAfterContribution), this.builtinContributions.forEach(item => this._renderContribitions.push(item)), this._renderContribitions.length && (this._renderContribitions.sort((a, b) => b.order - a.order), this._beforeRenderContribitions = this._renderContribitions.filter(c => c.time === BaseRenderContributionTime.beforeFillStroke), this._afterRenderContribitions = this._renderContribitions.filter(c => c.time === BaseRenderContributionTime.afterFillStroke));
   }
+  reInit() {
+    this.init(this.graphicRenderContributions);
+  }
   beforeRenderStep(graphic, context, x, y, doFill, doStroke, fVisible, sVisible, graphicAttribute, drawContext, fillCb, strokeCb, params) {
     this._beforeRenderContribitions && this._beforeRenderContribitions.forEach(c => {
       if (c.supportedAppName && graphic.stage && graphic.stage.params && graphic.stage.params.context && graphic.stage.params.context.appName) {
@@ -11017,8 +11079,8 @@ var __decorate$G = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasArcRender = class extends BaseRender {
-  constructor(arcRenderContribitions) {
-    super(), this.arcRenderContribitions = arcRenderContribitions, this.numberType = ARC_NUMBER_TYPE, this.builtinContributions = [defaultArcRenderContribution, defaultArcBackgroundRenderContribution, defaultArcTextureRenderContribution], this.init(arcRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = ARC_NUMBER_TYPE, this.builtinContributions = [defaultArcRenderContribution, defaultArcBackgroundRenderContribution, defaultArcTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawArcTailCapPath(arc, context, cx, cy, outerRadius, innerRadius, _sa, _ea) {
     const capAngle = _ea - _sa,
@@ -11190,8 +11252,8 @@ var __decorate$F = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasCircleRender = class extends BaseRender {
-  constructor(circleRenderContribitions) {
-    super(), this.circleRenderContribitions = circleRenderContribitions, this.numberType = CIRCLE_NUMBER_TYPE, this.builtinContributions = [defaultCircleRenderContribution, defaultCircleBackgroundRenderContribution, defaultCircleTextureRenderContribution], this.init(circleRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = CIRCLE_NUMBER_TYPE, this.builtinContributions = [defaultCircleRenderContribution, defaultCircleBackgroundRenderContribution, defaultCircleTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(circle, context, x, y, drawContext, params, fillCb, strokeCb) {
     const circleAttribute = getTheme(circle, null == params ? void 0 : params.theme).circle,
@@ -11577,8 +11639,8 @@ var __decorate$D = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasAreaRender = class extends BaseRender {
-  constructor(areaRenderContribitions) {
-    super(), this.areaRenderContribitions = areaRenderContribitions, this.numberType = AREA_NUMBER_TYPE, this.builtinContributions = [defaultAreaTextureRenderContribution, defaultAreaBackgroundRenderContribution], this.init(areaRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = AREA_NUMBER_TYPE, this.builtinContributions = [defaultAreaTextureRenderContribution, defaultAreaBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawLinearAreaHighPerformance(area, context, fill, stroke, fillOpacity, strokeOpacity, offsetX, offsetY, areaAttribute, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -11821,8 +11883,8 @@ var __decorate$C = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasPathRender = class extends BaseRender {
-  constructor(pathRenderContribitions) {
-    super(), this.pathRenderContribitions = pathRenderContribitions, this.numberType = PATH_NUMBER_TYPE, this.builtinContributions = [defaultPathBackgroundRenderContribution, defaultPathTextureRenderContribution], this.init(pathRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = PATH_NUMBER_TYPE, this.builtinContributions = [defaultPathBackgroundRenderContribution, defaultPathTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(path, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -11877,8 +11939,8 @@ var __decorate$B = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasRectRender = class extends BaseRender {
-  constructor(rectRenderContribitions) {
-    super(), this.rectRenderContribitions = rectRenderContribitions, this.type = "rect", this.numberType = RECT_NUMBER_TYPE, this.builtinContributions = [defaultRectRenderContribution, defaultRectBackgroundRenderContribution, defaultRectTextureRenderContribution], this.init(rectRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.type = "rect", this.numberType = RECT_NUMBER_TYPE, this.builtinContributions = [defaultRectRenderContribution, defaultRectBackgroundRenderContribution, defaultRectTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(rect, context, x, y, drawContext, params, fillCb, strokeCb, rectAttribute) {
     rectAttribute = null != rectAttribute ? rectAttribute : getTheme(rect, null == params ? void 0 : params.theme).rect;
@@ -11947,8 +12009,8 @@ var __decorate$A = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasSymbolRender = class extends BaseRender {
-  constructor(symbolRenderContribitions) {
-    super(), this.symbolRenderContribitions = symbolRenderContribitions, this.numberType = SYMBOL_NUMBER_TYPE, this.builtinContributions = [defaultSymbolRenderContribution, defaultSymbolBackgroundRenderContribution, defaultSymbolTextureRenderContribution, defaultSymbolClipRangeStrokeRenderContribution], this.init(symbolRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = SYMBOL_NUMBER_TYPE, this.builtinContributions = [defaultSymbolRenderContribution, defaultSymbolBackgroundRenderContribution, defaultSymbolTextureRenderContribution, defaultSymbolClipRangeStrokeRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(symbol, context, x, y, drawContext, params, fillCb, strokeCb, symbolAttribute) {
     var _a;
@@ -12118,8 +12180,8 @@ var __decorate$z = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasTextRender = class extends BaseRender {
-  constructor(textRenderContribitions) {
-    super(), this.textRenderContribitions = textRenderContribitions, this.numberType = TEXT_NUMBER_TYPE, this.builtinContributions = [defaultTextBackgroundRenderContribution], this.init(textRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = TEXT_NUMBER_TYPE, this.builtinContributions = [defaultTextBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(text, context, x, y, drawContext, params, fillCb, strokeCb) {
     var _a, _b, _c;
@@ -12254,8 +12316,10 @@ let DefaultCanvasTextRender = class extends BaseRender {
 DefaultCanvasTextRender = __decorate$z([injectable(), __param$q(0, inject(ContributionProvider)), __param$q(0, named(TextRenderContribution)), __metadata$t("design:paramtypes", [Object])], DefaultCanvasTextRender);
 
 function drawPolygon(path, points, x, y) {
-  path.moveTo(points[0].x + x, points[0].y + y);
-  for (let i = 1; i < points.length; i++) path.lineTo(points[i].x + x, points[i].y + y);
+  if (points && points.length) {
+    path.moveTo(points[0].x + x, points[0].y + y);
+    for (let i = 1; i < points.length; i++) path.lineTo(points[i].x + x, points[i].y + y);
+  }
 }
 function drawRoundedPolygon(path, points, x, y, cornerRadius) {
   let closePath = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : !0;
@@ -12323,8 +12387,8 @@ var __decorate$y = undefined && undefined.__decorate || function (decorators, ta
     };
   };
 let DefaultCanvasPolygonRender = class extends BaseRender {
-  constructor(polygonRenderContribitions) {
-    super(), this.polygonRenderContribitions = polygonRenderContribitions, this.numberType = POLYGON_NUMBER_TYPE, this.builtinContributions = [defaultPolygonBackgroundRenderContribution, defaultPolygonTextureRenderContribution], this.init(polygonRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = POLYGON_NUMBER_TYPE, this.builtinContributions = [defaultPolygonBackgroundRenderContribution, defaultPolygonTextureRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(polygon, context, x, y, drawContext, params, fillCb, strokeCb) {
     const polygonAttribute = getTheme(polygon, null == params ? void 0 : params.theme).polygon,
@@ -12379,6 +12443,9 @@ let DefaultCanvasGroupRender = class {
   constructor(groupRenderContribitions) {
     this.groupRenderContribitions = groupRenderContribitions, this.numberType = GROUP_NUMBER_TYPE;
   }
+  reInit() {
+    this._groupRenderContribitions = this.groupRenderContribitions.getContributions() || [], this._groupRenderContribitions.push(defaultGroupBackgroundRenderContribution);
+  }
   drawShape(group, context, x, y, drawContext, params, fillCb, strokeCb, groupAttribute) {
     const {
       clip: clip,
@@ -12521,8 +12588,8 @@ var __decorate$w = undefined && undefined.__decorate || function (decorators, ta
   };
 const repeatStr = ["", "repeat-x", "repeat-y", "repeat"];
 let DefaultCanvasImageRender = class extends BaseRender {
-  constructor(imageRenderContribitions) {
-    super(), this.imageRenderContribitions = imageRenderContribitions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageRenderContribution, defaultImageBackgroundRenderContribution], this.init(imageRenderContribitions);
+  constructor(graphicRenderContributions) {
+    super(), this.graphicRenderContributions = graphicRenderContributions, this.numberType = IMAGE_NUMBER_TYPE, this.builtinContributions = [defaultImageRenderContribution, defaultImageBackgroundRenderContribution], this.init(graphicRenderContributions);
   }
   drawShape(image, context, x, y, drawContext, params, fillCb, strokeCb) {
     const imageAttribute = getTheme(image).image,
@@ -12846,6 +12913,9 @@ let DefaultRenderService = class {
   afterDraw(params) {
     this.drawContribution.afterDraw && this.drawContribution.afterDraw(this, Object.assign({}, this.drawParams));
   }
+  reInit() {
+    this.drawContribution.reInit();
+  }
   render(groups, params) {
     this.renderTreeRoots = groups, this.drawParams = params;
     const updateBounds = params.updateBounds;
@@ -13254,6 +13324,11 @@ let DefaultDrawContribution = class {
       }, !1, !!(null === (_a = drawContext.context) || void 0 === _a ? void 0 : _a.camera));
     }, this.currentRenderMap = new Map(), this.defaultRenderMap = new Map(), this.styleRenderMap = new Map(), this.dirtyBounds = new Bounds(), this.backupDirtyBounds = new Bounds(), this.global = application.global, this.layerService = application.layerService, isArray(this.contributions) || (this.contributions = [this.contributions]), this.init();
   }
+  reInit() {
+    this.init(), this.contributions.forEach(item => {
+      item.reInit();
+    });
+  }
   init() {
     this.contributions.forEach(item => {
       if (item.style) {
@@ -14975,6 +15050,11 @@ class ScrollBar extends AbstractComponent {
     constructor(attributes, options) {
         super((options === null || options === void 0 ? void 0 : options.skipDefault) ? attributes : merge({}, ScrollBar.defaultAttributes, attributes));
         this.name = 'scrollbar';
+        this._handleTouchMove = (e) => {
+            if (isValid(this._prePos)) {
+                e.preventDefault();
+            }
+        };
         this._onRailPointerDown = (e) => {
             const { viewX, viewY } = e;
             const { direction, width, height, range } = this.attribute;
@@ -15013,7 +15093,7 @@ class ScrollBar extends AbstractComponent {
             });
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true, passive: true });
+            obj.addEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onSliderPointerUp);
             });
@@ -15038,7 +15118,6 @@ class ScrollBar extends AbstractComponent {
             return [currentPos, currentScrollValue];
         };
         this._onSliderPointerMove = (e) => {
-            e.preventDefault();
             const { stopSliderMovePropagation = true } = this.attribute;
             if (stopSliderMovePropagation) {
                 e.stopPropagation();
@@ -15056,6 +15135,7 @@ class ScrollBar extends AbstractComponent {
             const preScrollRange = this.getScrollRange();
             const [currentPos, currentScrollValue] = this._computeScrollValue(e);
             const range = [preScrollRange[0] + currentScrollValue, preScrollRange[1] + currentScrollValue];
+            this._prePos = null;
             this._dispatchEvent(SCROLLBAR_END_EVENT, {
                 pre: preRange,
                 value: clampRange(range, limitRange[0], limitRange[1])
@@ -15110,6 +15190,9 @@ class ScrollBar extends AbstractComponent {
         if (this._slider) {
             this._slider.addEventListener('pointerdown', this._onSliderPointerDown);
         }
+        (vglobal.env === 'browser' ? vglobal : this.stage).addEventListener('touchmove', this._handleTouchMove, {
+            passive: false
+        });
     }
     render() {
         this._reset();
@@ -15196,7 +15279,7 @@ class ScrollBar extends AbstractComponent {
     _clearDragEvents() {
         const triggers = getEndTriggersOfDrag();
         const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-        obj.removeEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true, passive: false });
+        obj.removeEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onSliderPointerUp);
         });
@@ -15205,6 +15288,13 @@ class ScrollBar extends AbstractComponent {
         this._sliderRenderBounds = null;
         this._sliderLimitRange = null;
     }
+    release(all) {
+        super.release(all);
+        (vglobal.env === 'browser' ? vglobal : this.stage).addEventListener('touchmove', this._handleTouchMove, {
+            passive: false
+        });
+        this._clearDragEvents();
+    }
 }
 ScrollBar.defaultAttributes = {
     direction: 'horizontal',
@@ -24658,13 +24748,14 @@ class DataZoom extends AbstractComponent {
             const evtTarget = vglobal.env === 'browser' ? vglobal : this.stage;
             const triggers = getEndTriggersOfDrag();
             evtTarget.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
-            this.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+            this.addEventListener('pointermove', this._onHandlerPointerMove, {
+                capture: true
+            });
             triggers.forEach((trigger) => {
                 evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
             });
         };
         this._pointerMove = (e) => {
-            e.preventDefault();
             const { start: startAttr, end: endAttr, brushSelect, realTime = true } = this.attribute;
             const pos = this.eventPosToStagePos(e);
             const { attPos, max } = this._layoutCache;
@@ -24817,7 +24908,9 @@ class DataZoom extends AbstractComponent {
         triggers.forEach((trigger) => {
             evtTarget.removeEventListener(trigger, this._onHandlerPointerUp);
         });
-        this.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+        this.removeEventListener('pointermove', this._onHandlerPointerMove, {
+            capture: true
+        });
     }
     _onHandlerPointerEnter(e) {
         this._showText = true;
@@ -28859,14 +28952,13 @@ class Slider extends AbstractComponent {
             this._prePos = this._isHorizontal ? x : y;
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
+            obj.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onHandlerPointerUp);
             });
         };
         this._onHandlerPointerMove = (e) => {
             var _a, _b;
-            e.preventDefault();
             this._isChanging = true;
             const { railWidth, railHeight, min, max } = this.attribute;
             if (max === min) {
@@ -28918,13 +29010,12 @@ class Slider extends AbstractComponent {
             this._prePos = this._isHorizontal ? x : y;
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onTrackPointerMove, { capture: true, passive: false });
+            obj.addEventListener('pointermove', this._onTrackPointerMove, { capture: true });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onTrackPointerUp);
             });
         };
         this._onTrackPointerMove = (e) => {
-            e.preventDefault();
             this._isChanging = true;
             const { railWidth, railHeight, min, max, inverse } = this.attribute;
             if (max === min) {
@@ -29374,11 +29465,11 @@ class Slider extends AbstractComponent {
     _clearAllDragEvents() {
         const triggers = getEndTriggersOfDrag();
         const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-        obj.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
+        obj.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onHandlerPointerUp);
         });
-        obj.removeEventListener('pointermove', this._onTrackPointerMove, { capture: true, passive: false });
+        obj.removeEventListener('pointermove', this._onTrackPointerMove, { capture: true });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onTrackPointerUp);
         });
@@ -33032,6 +33123,6 @@ StoryLabelItem.defaultAttributes = {
     theme: 'default'
 };
 
-const version = "1.0.0-alpha.17";
+const version = "1.0.0-alpha.19";
 
 export { AXIS_ELEMENT_NAME, AbstractComponent, ArcInfo, ArcLabel, ArcSegment, AxisStateValue, BasePlayer, Brush, CheckBox, CircleAxis, CircleAxisGrid, CircleCrosshair, ColorContinuousLegend, ContinuousPlayer, DEFAULT_ITEM_SPACE_COL, DEFAULT_ITEM_SPACE_ROW, DEFAULT_LABEL_SPACE, DEFAULT_PAGER_SPACE, DEFAULT_SHAPE_SIZE, DEFAULT_SHAPE_SPACE, DEFAULT_STATES$1 as DEFAULT_STATES, DEFAULT_TITLE_SPACE, DEFAULT_VALUE_SPACE, DataLabel, DataZoom, DataZoomActiveTag, DirectionEnum, DiscreteLegend, DiscretePlayer, EmptyTip, GroupTransition, IMarkAreaLabelPosition, IMarkCommonArcLabelPosition, IMarkLineLabelPosition, IMarkPointItemPosition, IOperateType, Indicator, LEGEND_ELEMENT_NAME, LabelBase, LegendEvent, LegendStateValue, LineAxis, LineAxisGrid, LineCrosshair, LineLabel, LinkPath, MarkArcArea, MarkArcLine, MarkArea, MarkLine, MarkPoint, Pager, PlayerEventEnum, PolygonCrosshair, PolygonSectorCrosshair, PopTip, Radio, RectCrosshair, RectLabel, SLIDER_ELEMENT_NAME, ScrollBar, SectorCrosshair, Segment, SizeContinuousLegend, Slider, StoryLabelItem, Switch, SymbolLabel, Tag, Timeline, Title, Tooltip, TopZIndex, VTag, WeatherBox, alignTextInLine, angle, angleLabelOrientAttribute, angleTo, cartesianTicks, clampRadian, computeOffsetForlimit, continuousTicks, contrastAccessibilityChecker, convertDomainToTickData, createTextGraphicByType, deltaXYToAngle, fuzzyEqualNumber, getAxisBreakSymbolAttrs, getCircleLabelPosition, getCirclePoints, getCircleVerticalVector, getElMap, getHorizontalPath, getMarksByName, getNoneGroupMarksByName, getPolarAngleLabelPosition, getPolygonPath, getSizeHandlerPath, getTextAlignAttrOfVerticalDir, getTextType, getVerticalCoord, getVerticalPath, hasOverlap, htmlAttributeTransform, initTextMeasure, isInRange, isPostiveXAxis, isRichText, isVisible, labelSmartInvert, length, limitShapeInBounds, linearDiscreteTicks, loadPoptip, loadScrollbar, measureTextSize, normalize, polarAngleAxisDiscreteTicks, polarTicks, reactAttributeTransform, registerArcDataLabel, registerLineDataLabel, registerMarkArcAreaAnimate, registerMarkArcLineAnimate, registerMarkAreaAnimate, registerMarkLineAnimate, registerMarkPointAnimate, registerRectDataLabel, registerSymbolDataLabel, removeRepeatPoint, richTextAttributeTransform, scale, scrollbarModule, setPoptipTheme, smartInvertStrategy, tan2AngleToAngle, textIntersect, ticks, traverseGroup, version };

package/es/data-zoom/data-zoom.js

@@ -79,7 +79,6 @@ export class DataZoom extends AbstractComponent {
                 evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
             }));
         }, this._pointerMove = e => {
-            e.preventDefault();
             const {start: startAttr, end: endAttr, brushSelect: brushSelect, realTime: realTime = !0} = this.attribute, pos = this.eventPosToStagePos(e), {attPos: attPos, max: max} = this._layoutCache, dis = (pos[attPos] - this._activeCache.lastPos[attPos]) / max;
             let {start: start, end: end} = this.state;
             this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end,