@visactor/vrender-core 0.16.0-alpha.0 → 0.16.0-alpha.12

package/es/interface/graphic.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/graphic.ts"],"names":[],"mappings":"","file":"graphic.js","sourcesContent":["import type { IAABBBounds, IOBBBounds, IMatrix, IPointLike, IPoint } from '@visactor/vutils';\nimport type { IAnimate, IStep, EasingType, IAnimateTarget } from './animate';\nimport type { IColor } from './color';\nimport type { IGroup } from './graphic/group';\nimport type { IShadowRoot } from './graphic/shadow-root';\nimport type { ILayer } from './layer';\nimport type { INode } from './node-tree';\nimport type { ICustomPath2D } from './path';\nimport type { IStage } from './stage';\nimport type { IGlyphGraphicAttribute } from './graphic/glyph';\nimport type { IContainPointMode } from '../common/enums';\nimport type { IFace3d } from './graphic/face3d';\n\ntype IStrokeSeg = {\n  start: number; // 百分比\n  // end和length二选一\n  end: number; // 百分比\n  length: number; // 像素长度\n};\n\n// TODO 最后加一个any\nexport type GraphicType =\n  | 'area'\n  | 'circle'\n  | 'ellipse'\n  | 'line'\n  | 'rect'\n  | 'rect3d'\n  | 'path'\n  | 'richtext'\n  | 'text'\n  | 'arc'\n  | 'arc3d'\n  | 'image'\n  | 'symbol'\n  | 'group'\n  | 'shadowroot'\n  | 'polygon'\n  | 'pyramid3d'\n  | 'glyph';\n\n// Cursor style\n// See: https://developer.mozilla.org/en-US/docs/Web/CSS/cursor\nexport type Cursor =\n  | 'auto'\n  | 'default'\n  | 'none'\n  | 'context-menu'\n  | 'help'\n  | 'pointer'\n  | 'progress'\n  | 'wait'\n  | 'cell'\n  | 'crosshair'\n  | 'text'\n  | 'vertical-text'\n  | 'alias'\n  | 'copy'\n  | 'move'\n  | 'no-drop'\n  | 'not-allowed'\n  | 'grab'\n  | 'grabbing'\n  | 'all-scroll'\n  | 'col-resize'\n  | 'row-resize'\n  | 'n-resize'\n  | 'e-resize'\n  | 's-resize'\n  | 'w-resize'\n  | 'ne-resize'\n  | 'nw-resize'\n  | 'se-resize'\n  | 'sw-resize'\n  | 'ew-resize'\n  | 'ns-resize'\n  | 'nesw-resize'\n  | 'nwse-resize'\n  | 'zoom-in'\n  | 'zoom-out';\n\nexport type ITransform = {\n  x: number;\n  y: number;\n  z: number;\n  dx: number;\n  dy: number;\n  dz: number;\n  scrollX: number;\n  scrollY: number;\n  scaleX: number;\n  scaleY: number;\n  scaleZ: number;\n  angle: number;\n  alpha: number;\n  beta: number;\n  scaleCenter: [number, number];\n  anchor: [number | string, number | string]; // 基于AABB的锚点位置，用于简单的定位某些path\n  anchor3d: [number | string, number | string, number] | [number | string, number | string]; // 3d的锚点位置\n  postMatrix: IMatrix;\n};\n\nexport type IFillType = boolean | string | IColor;\nexport type IFillStyle = {\n  fillOpacity: number;\n  shadowBlur: number;\n  shadowColor: string;\n  shadowOffsetX: number;\n  shadowOffsetY: number;\n  fill: IFillType;\n};\n\nexport type ILayout = {\n  alignSelf: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';\n};\n\nexport type IBorderStyle = Omit<IStrokeStyle, 'outerBorder' | 'innerBorder'> & {\n  distance: number | string;\n  visible?: boolean;\n};\n\nexport type IStrokeType = boolean | string | IColor | null;\nexport type IStrokeStyle = {\n  outerBorder: Partial<IBorderStyle>;\n  innerBorder: Partial<IBorderStyle>;\n  strokeOpacity: number;\n  lineDash: number[];\n  lineDashOffset: number;\n  lineWidth: number;\n  lineCap: CanvasLineCap;\n  lineJoin: CanvasLineJoin;\n  miterLimit: number;\n  // 描边的boundsBuffer，用于控制bounds的buffer\n  strokeBoundsBuffer: number;\n  /**\n   * stroke - true 全描边\n   * stroke - false 不描边\n   * stroke 为数值类型，适用于rect\\arc等图形，用于配置部分描边的场景，其中\n   *\n   * 0b00000 - 不描边\n   * 0b000001 - top\n   * 0b000010 - right\n   * 0b000100 - bottom\n   * 0b001000 - left\n   * 相应的：\n   * 0b000011 - top + right\n   * 0b000111 - top + right + bottom\n   * 0b001111 - 全描边\n   *\n   * stroke - boolean[]，适用于rect\\arc等图形，用于配置部分描边的场景\n   */\n  stroke: IStrokeType[] | IStrokeType;\n};\n\ntype TextureType = 'circle' | 'diamond' | 'rect' | 'vertical-line' | 'horizontal-line' | 'bias-lr' | 'bias-rl' | 'grid';\n\nexport type IConnectedStyle = {\n  // 连接，取零或者断开\n  connectedType: 'connect' | 'zero' | 'none';\n  connectedStyle: {\n    stroke: IStrokeStyle['stroke'];\n    strokeOpacity: IStrokeStyle['strokeOpacity'];\n    lineDash: IStrokeStyle['lineDash'];\n    lineDashOffset: IStrokeStyle['lineDashOffset'];\n    lineCap: IStrokeStyle['lineCap'];\n    lineJoin: IStrokeStyle['lineJoin'];\n    lineWidth: IStrokeStyle['lineWidth'];\n    fill: IFillStyle['fill'];\n    fillOpacity: IFillStyle['fillOpacity'];\n  };\n  connectedX: number;\n  connectedY: number;\n};\n\nexport type IBackgroundConfig = {\n  stroke?: string | boolean;\n  fill?: string | boolean;\n  lineWidth?: number;\n  cornerRadius?: number;\n  expandX?: number;\n  expandY?: number;\n};\n\nexport type IGraphicStyle = IFillStyle &\n  IStrokeStyle & {\n    opacity: number;\n    backgroundMode: number; // 填充模式（与具体图元有关）\n    background: string | HTMLImageElement | HTMLCanvasElement | IBackgroundConfig | null; // 背景，可以与fill同时存在\n    texture: TextureType | string; // 纹理\n    textureColor: string; // 纹理颜色\n    textureSize: number; // 纹理大小\n    texturePadding: number; // 纹理间隙\n    blur: number;\n    cursor: Cursor | null; // 鼠标样式\n    // HTML的dom或者string\n    html: {\n      dom: string | HTMLElement; // dom字符串或者dom\n      container: string | HTMLElement | null; // id或者dom\n      width: number; // 容器的宽度\n      height: number; // 容器的高度\n      style: string | Record<string, any>; // 容器的样式\n      visible?: boolean;\n      anchorType?: 'position' | 'boundsLeftTop';\n    } | null;\n  };\n\nexport type IGraphicAttribute = IGraphicStyle &\n  ITransform & {\n    /**\n     * stroke百分比\n     */\n    strokeSeg: IStrokeSeg | null;\n    // 包围盒的padding\n    boundsPadding: number | number[];\n    /**\n     * 选择模式，精确模式，粗糙模式（包围盒模式），自定义模式\n     */\n    pickMode: 'accurate' | 'imprecise' | 'custom';\n    boundsMode: 'accurate' | 'imprecise';\n    customPickShape: () => boolean | null;\n    /**\n     * 是否支持事件拾取，默认为 true。\n     * @default true\n     */\n    pickable: boolean;\n    /**\n     * 对于 group 节点，是否支持其子元素的事件拾取，默认为 true。\n     * 如果 group `pickable` 关闭，`childrenPickable` 开启，那么 group 的子节点仍参与事件拾取\n     * @default true\n     */\n    childrenPickable: boolean;\n    /**\n     * 元素是否可见。\n     * @default true\n     */\n    visible: boolean;\n    zIndex: number;\n    layout: any;\n    /**\n     * 是否在3d中控制方向\n     * false: 不控制方向\n     * true: 始终控制方向朝摄像机\n     */\n    keepDirIn3d?: boolean;\n    shadowRootIdx: number;\n  };\n\nexport interface IGraphicJson<T extends Partial<IGraphicAttribute> = Partial<IGraphicAttribute>> {\n  attribute: Partial<T>;\n  _uid: number;\n  type: string;\n  name: string;\n  children: IGraphicJson<T>[];\n}\n\n/** the context of setAttribute */\nexport type ISetAttributeContext = {\n  /** type of setAttribute */\n  type?: number;\n  animationState?: {\n    step?: IStep;\n    isFirstFrameOfStep?: boolean;\n    /** ratio of animation */\n    ratio?: number;\n    /** is animation end? */\n    end?: boolean;\n  };\n};\n\nexport type IGraphicAnimateParams = {\n  id?: number | string;\n  onStart?: () => void;\n  onFrame?: (step: IStep, ratio: number) => void;\n  onEnd?: () => void;\n  onRemove?: () => void;\n  interpolate?: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;\n};\n\nexport interface IGraphic<T extends Partial<IGraphicAttribute> = Partial<IGraphicAttribute>>\n  extends INode,\n    IAnimateTarget {\n  type?: GraphicType;\n  numberType?: number;\n  stage?: IStage;\n  layer?: ILayer;\n  shadowRoot?: IShadowRoot;\n  glyphHost?: IGraphic<IGlyphGraphicAttribute>;\n  backgroundImg?: boolean;\n\n  bindDom?: Map<string | HTMLElement, { container: HTMLElement | string; dom: HTMLElement; wrapGroup: HTMLDivElement }>;\n\n  valid: boolean;\n  parent: IGroup | null;\n  isContainer?: boolean;\n  // 是否是3d模式（是否应用3d视角）\n  in3dMode?: boolean;\n\n  // 上次更新的stamp\n  stamp?: number;\n  animationBackUps?: {\n    from: Record<string, any>;\n    to: Record<string, any>;\n  };\n\n  attribute: Partial<T>;\n\n  /** 用于实现morph动画场景，转换成bezier曲线渲染 */\n  pathProxy?: ICustomPath2D | ((attrs: T) => ICustomPath2D);\n  incremental?: number;\n  incrementalAt?: number;\n\n  /** 记录state对应的图形属性 */\n  states?: Record<string, Partial<T>>;\n  normalAttrs?: Partial<T>;\n  stateProxy?: (stateName: string, targetStates?: string[]) => Partial<T>;\n  findFace?: () => IFace3d;\n  toggleState: (stateName: string, hasAnimation?: boolean) => void;\n  removeState: (stateName: string, hasAnimation?: boolean) => void;\n  clearStates: (hasAnimation?: boolean) => void;\n  useStates: (states: string[], hasAnimation?: boolean) => void;\n  addState: (stateName: string, keepCurrentStates?: boolean, hasAnimation?: boolean) => void;\n  hasState: (stateName?: string) => boolean;\n  getState: (stateName: string) => Partial<T>;\n  onBeforeAttributeUpdate?: (\n    val: any,\n    attributes: Partial<T>,\n    key: null | string | string[],\n    context?: ISetAttributeContext\n  ) => T | undefined;\n  applyStateAttrs: (attrs: Partial<T>, stateNames: string[], hasAnimation?: boolean, isClear?: boolean) => void;\n  updateNormalAttrs: (stateAttrs: Partial<T>) => void;\n\n  // get\n  readonly AABBBounds: IAABBBounds; // 用于获取当前节点的AABB包围盒\n  readonly OBBBounds: IOBBBounds; // 获取OBB包围盒，旋转防重叠需要用\n  readonly globalAABBBounds: IAABBBounds; // 全局AABB包围盒\n  readonly transMatrix: IMatrix; // 变换矩阵，动态计算\n  readonly globalTransMatrix: IMatrix; // 变换矩阵，动态计算\n\n  getOffsetXY: (attr?: ITransform) => IPoint;\n\n  // function\n  containsPoint: (x: number, y: number, mode?: IContainPointMode) => boolean;\n\n  setMode: (mode: '3d' | '2d') => void;\n  isValid: () => boolean;\n\n  // TODO: transform API\n  // 基于当前transform的变换，普通用户尽量别用，拿捏不住的~\n  translate: (x: number, y: number) => this;\n  translateTo: (x: number, y: number) => this;\n  scale: (scaleX: number, scaleY: number, scaleCenter?: IPointLike) => this;\n  scaleTo: (scaleX: number, scaleY: number) => this;\n  rotate: (angle: number, rotateCenter?: IPointLike) => this;\n  rotateTo: (angle: number) => this;\n  skewTo: (b: number, c: number) => this;\n  addUpdateBoundTag: () => void;\n  addUpdateShapeAndBoundsTag: () => void;\n  addUpdateLayoutTag: () => void;\n\n  update: (d?: { bounds: boolean; trans: boolean }) => void;\n\n  // animate\n  animate: (params?: IGraphicAnimateParams) => IAnimate;\n\n  // 语法糖，可有可无，有的为了首屏性能考虑做成get方法，有的由外界直接托管，内部不赋值\n  name?: string;\n\n  // 供render处理shape缓存tag\n  shouldUpdateShape: () => boolean;\n  clearUpdateShapeTag: () => void;\n\n  // // 供render缓存shape\n  // cacheShape?: ICustomPath2D;\n  // // 线段使用的path2D\n  // cacheLine?: ISegPath2D | ISegPath2D[];\n  // // 面积图使用的path2D\n  // cacheArea?: IAreaCacheItem | IAreaCacheItem[];\n\n  setAttributes: (params: Partial<T>, forceUpdateTag?: boolean, context?: ISetAttributeContext) => void;\n\n  initAttributes: (params: Partial<T>) => void;\n\n  setAttribute: (key: string, value: any, forceUpdateTag?: boolean, context?: ISetAttributeContext) => void;\n\n  setStage: (stage?: IStage, layer?: ILayer) => void;\n  onSetStage: (cb: (g: IGraphic, stage: IStage) => void) => void;\n\n  shouldUpdateAABBBounds: () => boolean;\n  shouldSelfChangeUpdateAABBBounds: () => boolean;\n  shouldUpdateGlobalMatrix: () => boolean;\n\n  addUpdatePositionTag: () => void;\n  addUpdateGlobalPositionTag: () => void;\n\n  attachShadow: () => IShadowRoot;\n  detachShadow: () => void;\n\n  toJson: () => IGraphicJson;\n\n  /** 创建pathProxy */\n  createPathProxy: (path?: string) => void;\n  /** 将图形转换成CustomPath2D */\n  toCustomPath?: () => ICustomPath2D;\n\n  resources?: Map<\n    string | HTMLImageElement | HTMLCanvasElement | IBackgroundConfig,\n    { state: 'init' | 'loading' | 'success' | 'fail'; data?: HTMLImageElement | HTMLCanvasElement }\n  >;\n  imageLoadSuccess: (url: string, data: HTMLImageElement) => void;\n  imageLoadFail: (url: string) => void;\n\n  clone: () => IGraphic;\n  stopAnimates: (stopChildren?: boolean) => void;\n  getNoWorkAnimateAttr: () => Record<string, number>;\n}\n\nexport interface IRoot extends IGraphic {\n  pick: (x: number, y: number) => IGraphic;\n}\n\n/**\n * 动画配置\n */\nexport type IAnimateConfig = {\n  duration?: number;\n  easing?: EasingType;\n};\n\nexport type GraphicReleaseStatus = 'released' | 'willRelease';\n"]}
+{"version":3,"sources":["../src/interface/graphic.ts"],"names":[],"mappings":"","file":"graphic.js","sourcesContent":["import type { IAABBBounds, IOBBBounds, IMatrix, IPointLike, IPoint } from '@visactor/vutils';\nimport type { IAnimate, IStep, EasingType, IAnimateTarget } from './animate';\nimport type { IColor } from './color';\nimport type { IGroup } from './graphic/group';\nimport type { IShadowRoot } from './graphic/shadow-root';\nimport type { ILayer } from './layer';\nimport type { INode } from './node-tree';\nimport type { ICustomPath2D } from './path';\nimport type { IStage } from './stage';\nimport type { IGlyphGraphicAttribute } from './graphic/glyph';\nimport type { IContainPointMode } from '../common/enums';\nimport type { IFace3d } from './graphic/face3d';\n\ntype IStrokeSeg = {\n  start: number; // 百分比\n  // end和length二选一\n  end: number; // 百分比\n  length: number; // 像素长度\n};\n\n// TODO 最后加一个any\nexport type GraphicType =\n  | 'area'\n  | 'circle'\n  | 'ellipse'\n  | 'line'\n  | 'rect'\n  | 'rect3d'\n  | 'path'\n  | 'richtext'\n  | 'text'\n  | 'arc'\n  | 'arc3d'\n  | 'image'\n  | 'symbol'\n  | 'group'\n  | 'shadowroot'\n  | 'polygon'\n  | 'pyramid3d'\n  | 'glyph';\n\n// Cursor style\n// See: https://developer.mozilla.org/en-US/docs/Web/CSS/cursor\nexport type Cursor =\n  | 'auto'\n  | 'default'\n  | 'none'\n  | 'context-menu'\n  | 'help'\n  | 'pointer'\n  | 'progress'\n  | 'wait'\n  | 'cell'\n  | 'crosshair'\n  | 'text'\n  | 'vertical-text'\n  | 'alias'\n  | 'copy'\n  | 'move'\n  | 'no-drop'\n  | 'not-allowed'\n  | 'grab'\n  | 'grabbing'\n  | 'all-scroll'\n  | 'col-resize'\n  | 'row-resize'\n  | 'n-resize'\n  | 'e-resize'\n  | 's-resize'\n  | 'w-resize'\n  | 'ne-resize'\n  | 'nw-resize'\n  | 'se-resize'\n  | 'sw-resize'\n  | 'ew-resize'\n  | 'ns-resize'\n  | 'nesw-resize'\n  | 'nwse-resize'\n  | 'zoom-in'\n  | 'zoom-out';\n\nexport type ITransform = {\n  x: number;\n  y: number;\n  z: number;\n  dx: number;\n  dy: number;\n  dz: number;\n  scrollX: number;\n  scrollY: number;\n  scaleX: number;\n  scaleY: number;\n  scaleZ: number;\n  angle: number;\n  alpha: number;\n  beta: number;\n  scaleCenter: [number | string, number | string];\n  anchor: [number | string, number | string]; // 基于AABB的锚点位置，用于简单的定位某些path\n  anchor3d: [number | string, number | string, number] | [number | string, number | string]; // 3d的锚点位置\n  postMatrix: IMatrix;\n};\n\nexport type IFillType = boolean | string | IColor;\nexport type IFillStyle = {\n  fillOpacity: number;\n  shadowBlur: number;\n  shadowColor: string;\n  shadowOffsetX: number;\n  shadowOffsetY: number;\n  fill: IFillType;\n};\n\nexport type ILayout = {\n  alignSelf: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';\n};\n\nexport type IBorderStyle = Omit<IStrokeStyle, 'outerBorder' | 'innerBorder'> & {\n  distance: number | string;\n  visible?: boolean;\n};\n\nexport type IStrokeType = boolean | string | IColor | null;\nexport type IStrokeStyle = {\n  outerBorder: Partial<IBorderStyle>;\n  innerBorder: Partial<IBorderStyle>;\n  strokeOpacity: number;\n  lineDash: number[];\n  lineDashOffset: number;\n  lineWidth: number;\n  lineCap: CanvasLineCap;\n  lineJoin: CanvasLineJoin;\n  miterLimit: number;\n  // 描边的boundsBuffer，用于控制bounds的buffer\n  strokeBoundsBuffer: number;\n  /**\n   * stroke - true 全描边\n   * stroke - false 不描边\n   * stroke 为数值类型，适用于rect\\arc等图形，用于配置部分描边的场景，其中\n   *\n   * 0b00000 - 不描边\n   * 0b000001 - top\n   * 0b000010 - right\n   * 0b000100 - bottom\n   * 0b001000 - left\n   * 相应的：\n   * 0b000011 - top + right\n   * 0b000111 - top + right + bottom\n   * 0b001111 - 全描边\n   *\n   * stroke - boolean[]，适用于rect\\arc等图形，用于配置部分描边的场景\n   */\n  stroke: IStrokeType[] | IStrokeType;\n};\n\ntype TextureType = 'circle' | 'diamond' | 'rect' | 'vertical-line' | 'horizontal-line' | 'bias-lr' | 'bias-rl' | 'grid';\n\nexport type IConnectedStyle = {\n  // 连接，取零或者断开\n  connectedType: 'connect' | 'zero' | 'none';\n  connectedStyle: {\n    stroke: IStrokeStyle['stroke'];\n    strokeOpacity: IStrokeStyle['strokeOpacity'];\n    lineDash: IStrokeStyle['lineDash'];\n    lineDashOffset: IStrokeStyle['lineDashOffset'];\n    lineCap: IStrokeStyle['lineCap'];\n    lineJoin: IStrokeStyle['lineJoin'];\n    lineWidth: IStrokeStyle['lineWidth'];\n    fill: IFillStyle['fill'];\n    fillOpacity: IFillStyle['fillOpacity'];\n  };\n  connectedX: number;\n  connectedY: number;\n};\n\nexport type IBackgroundConfig = {\n  stroke?: string | boolean;\n  fill?: string | boolean;\n  lineWidth?: number;\n  cornerRadius?: number;\n  expandX?: number;\n  expandY?: number;\n};\n\nexport type IGraphicStyle = IFillStyle &\n  IStrokeStyle & {\n    opacity: number;\n    backgroundMode: number; // 填充模式（与具体图元有关）\n    background: string | HTMLImageElement | HTMLCanvasElement | IBackgroundConfig | null; // 背景，可以与fill同时存在\n    texture: TextureType | string; // 纹理\n    textureColor: string; // 纹理颜色\n    textureSize: number; // 纹理大小\n    texturePadding: number; // 纹理间隙\n    blur: number;\n    cursor: Cursor | null; // 鼠标样式\n    // HTML的dom或者string\n    html: {\n      dom: string | HTMLElement; // dom字符串或者dom\n      container: string | HTMLElement | null; // id或者dom\n      width: number; // 容器的宽度\n      height: number; // 容器的高度\n      style: string | Record<string, any>; // 容器的样式\n      visible?: boolean;\n      anchorType?: 'position' | 'boundsLeftTop';\n    } | null;\n  };\n\nexport type IDebugType = {\n  _debug_bounds: boolean | ((c: any, g: any) => void);\n};\nexport type IGraphicAttribute = IDebugType &\n  IGraphicStyle &\n  ITransform & {\n    /**\n     * stroke百分比\n     */\n    strokeSeg: IStrokeSeg | null;\n    // 包围盒的padding\n    boundsPadding: number | number[];\n    /**\n     * 选择模式，精确模式，粗糙模式（包围盒模式），自定义模式\n     */\n    pickMode: 'accurate' | 'imprecise' | 'custom';\n    boundsMode: 'accurate' | 'imprecise';\n    customPickShape: () => boolean | null;\n    /**\n     * 是否支持事件拾取，默认为 true。\n     * @default true\n     */\n    pickable: boolean;\n    /**\n     * 对于 group 节点，是否支持其子元素的事件拾取，默认为 true。\n     * 如果 group `pickable` 关闭，`childrenPickable` 开启，那么 group 的子节点仍参与事件拾取\n     * @default true\n     */\n    childrenPickable: boolean;\n    /**\n     * 元素是否可见。\n     * @default true\n     */\n    visible: boolean;\n    zIndex: number;\n    layout: any;\n    /**\n     * 是否在3d中控制方向\n     * false: 不控制方向\n     * true: 始终控制方向朝摄像机\n     */\n    keepDirIn3d?: boolean;\n    shadowRootIdx: number;\n    globalZIndex: number;\n    globalCompositeOperation: CanvasRenderingContext2D['globalCompositeOperation'] | '';\n    // 完全支持滚动 | 完全不支持滚动 | 支持x方向的滚动 | 支持y方向的滚动\n    overflow: 'scroll' | 'hidden' | 'scroll-x' | 'scroll-y';\n  };\n\nexport interface IGraphicJson<T extends Partial<IGraphicAttribute> = Partial<IGraphicAttribute>> {\n  attribute: Partial<T>;\n  _uid: number;\n  type: string;\n  name: string;\n  children: IGraphicJson<T>[];\n}\n\n/** the context of setAttribute */\nexport type ISetAttributeContext = {\n  /** type of setAttribute */\n  type?: number;\n  animationState?: {\n    step?: IStep;\n    isFirstFrameOfStep?: boolean;\n    /** ratio of animation */\n    ratio?: number;\n    /** is animation end? */\n    end?: boolean;\n  };\n  skipUpdateCallback?: boolean;\n};\n\nexport type IGraphicAnimateParams = {\n  id?: number | string;\n  onStart?: () => void;\n  onFrame?: (step: IStep, ratio: number) => void;\n  onEnd?: () => void;\n  onRemove?: () => void;\n  interpolate?: (key: string, ratio: number, from: any, to: any, nextAttributes: any) => boolean;\n};\n\nexport interface IGraphic<T extends Partial<IGraphicAttribute> = Partial<IGraphicAttribute>>\n  extends INode,\n    IAnimateTarget {\n  type?: GraphicType;\n  numberType?: number;\n  stage?: IStage;\n  layer?: ILayer;\n  shadowRoot?: IShadowRoot;\n  glyphHost?: IGraphic<IGlyphGraphicAttribute>;\n  backgroundImg?: boolean;\n\n  bindDom?: Map<string | HTMLElement, { container: HTMLElement | string; dom: HTMLElement; wrapGroup: HTMLDivElement }>;\n\n  valid: boolean;\n  parent: IGroup | null;\n  isContainer?: boolean;\n  // 是否是3d模式（是否应用3d视角）\n  in3dMode?: boolean;\n\n  // 上次更新的stamp\n  stamp?: number;\n  animationBackUps?: {\n    from: Record<string, any>;\n    to: Record<string, any>;\n  };\n\n  attribute: Partial<T>;\n\n  /** 用于实现morph动画场景，转换成bezier曲线渲染 */\n  pathProxy?: ICustomPath2D | ((attrs: T) => ICustomPath2D);\n  incremental?: number;\n  incrementalAt?: number;\n\n  /** 记录state对应的图形属性 */\n  states?: Record<string, Partial<T>>;\n  normalAttrs?: Partial<T>;\n  stateProxy?: (stateName: string, targetStates?: string[]) => Partial<T>;\n  findFace?: () => IFace3d;\n  toggleState: (stateName: string, hasAnimation?: boolean) => void;\n  removeState: (stateName: string, hasAnimation?: boolean) => void;\n  clearStates: (hasAnimation?: boolean) => void;\n  useStates: (states: string[], hasAnimation?: boolean) => void;\n  addState: (stateName: string, keepCurrentStates?: boolean, hasAnimation?: boolean) => void;\n  hasState: (stateName?: string) => boolean;\n  getState: (stateName: string) => Partial<T>;\n  onBeforeAttributeUpdate?: (\n    val: any,\n    attributes: Partial<T>,\n    key: null | string | string[],\n    context?: ISetAttributeContext\n  ) => T | undefined;\n  applyStateAttrs: (attrs: Partial<T>, stateNames: string[], hasAnimation?: boolean, isClear?: boolean) => void;\n  updateNormalAttrs: (stateAttrs: Partial<T>) => void;\n\n  // get\n  readonly AABBBounds: IAABBBounds; // 用于获取当前节点的AABB包围盒\n  readonly OBBBounds: IOBBBounds; // 获取OBB包围盒，旋转防重叠需要用\n  readonly globalAABBBounds: IAABBBounds; // 全局AABB包围盒\n  readonly transMatrix: IMatrix; // 变换矩阵，动态计算\n  readonly globalTransMatrix: IMatrix; // 变换矩阵，动态计算\n\n  getOffsetXY: (attr?: ITransform) => IPoint;\n\n  // function\n  containsPoint: (x: number, y: number, mode?: IContainPointMode) => boolean;\n\n  setMode: (mode: '3d' | '2d') => void;\n  isValid: () => boolean;\n\n  // TODO: transform API\n  // 基于当前transform的变换，普通用户尽量别用，拿捏不住的~\n  translate: (x: number, y: number) => this;\n  translateTo: (x: number, y: number) => this;\n  scale: (scaleX: number, scaleY: number, scaleCenter?: IPointLike) => this;\n  scaleTo: (scaleX: number, scaleY: number) => this;\n  rotate: (angle: number, rotateCenter?: IPointLike) => this;\n  rotateTo: (angle: number) => this;\n  skewTo: (b: number, c: number) => this;\n  addUpdateBoundTag: () => void;\n  addUpdateShapeAndBoundsTag: () => void;\n  addUpdateLayoutTag: () => void;\n\n  update: (d?: { bounds: boolean; trans: boolean }) => void;\n\n  // animate\n  animate: (params?: IGraphicAnimateParams) => IAnimate;\n\n  // 语法糖，可有可无，有的为了首屏性能考虑做成get方法，有的由外界直接托管，内部不赋值\n  name?: string;\n\n  // 供render处理shape缓存tag\n  shouldUpdateShape: () => boolean;\n  clearUpdateShapeTag: () => void;\n\n  // // 供render缓存shape\n  // cacheShape?: ICustomPath2D;\n  // // 线段使用的path2D\n  // cacheLine?: ISegPath2D | ISegPath2D[];\n  // // 面积图使用的path2D\n  // cacheArea?: IAreaCacheItem | IAreaCacheItem[];\n\n  setAttributes: (params: Partial<T>, forceUpdateTag?: boolean, context?: ISetAttributeContext) => void;\n\n  initAttributes: (params: Partial<T>) => void;\n\n  setAttribute: (key: string, value: any, forceUpdateTag?: boolean, context?: ISetAttributeContext) => void;\n\n  setStage: (stage?: IStage, layer?: ILayer) => void;\n  onSetStage: (cb: (g: IGraphic, stage: IStage) => void) => void;\n\n  shouldUpdateAABBBounds: () => boolean;\n  shouldSelfChangeUpdateAABBBounds: () => boolean;\n  shouldUpdateGlobalMatrix: () => boolean;\n\n  addUpdatePositionTag: () => void;\n  addUpdateGlobalPositionTag: () => void;\n\n  attachShadow: () => IShadowRoot;\n  detachShadow: () => void;\n\n  toJson: () => IGraphicJson;\n\n  /** 创建pathProxy */\n  createPathProxy: (path?: string) => void;\n  /** 将图形转换成CustomPath2D */\n  toCustomPath?: () => ICustomPath2D;\n\n  resources?: Map<\n    string | HTMLImageElement | HTMLCanvasElement | IBackgroundConfig,\n    { state: 'init' | 'loading' | 'success' | 'fail'; data?: HTMLImageElement | HTMLCanvasElement }\n  >;\n  imageLoadSuccess: (url: string, data: HTMLImageElement) => void;\n  imageLoadFail: (url: string) => void;\n\n  clone: () => IGraphic;\n  stopAnimates: (stopChildren?: boolean) => void;\n  getNoWorkAnimateAttr: () => Record<string, number>;\n}\n\nexport interface IRoot extends IGraphic {\n  pick: (x: number, y: number) => IGraphic;\n}\n\n/**\n * 动画配置\n */\nexport type IAnimateConfig = {\n  duration?: number;\n  easing?: EasingType;\n};\n\nexport type GraphicReleaseStatus = 'released' | 'willRelease';\n"]}

package/es/interface/layer.d.ts

@@ -7,11 +7,13 @@ import type { IStage } from './stage';
 import type { Releaseable } from './common';
 import type { IContext2d } from './context';
 import type { IWindow } from './window';
+export type LayerMode = 'static' | 'dynamic' | 'virtual';
 export interface ILayerParams {
     main: boolean;
     zIndex?: number;
+    layerMode: LayerMode;
+    layerHandler: ILayerHandlerContribution;
     canvasId?: string;
-    virtual?: boolean;
 }
 export interface ILayerDrawParams {
     renderService: IRenderService;
@@ -35,7 +37,8 @@ export interface ILayer extends IGroup {
     height: number;
     viewWidth: number;
     viewHeight: number;
-    readonly virtual: boolean;
+    readonly layerMode: LayerMode;
+    renderCount: number;
     offscreen: boolean;
     subLayers: Map<number, {
         layer: ILayer;
@@ -86,6 +89,9 @@ export interface ILayerHandlerInitParams {
     dpr?: number;
 }
 export interface ILayerHandlerContribution extends Releaseable {
+    secondaryHandlers?: ILayerHandlerContribution[];
+    mainHandler?: ILayerHandlerContribution;
+    type: LayerMode;
     init: (layer: ILayer, window: IWindow, params: ILayerHandlerInitParams) => void;
     resize: (w: number, h: number) => void;
     resizeView: (w: number, h: number) => void;
@@ -96,4 +102,5 @@ export interface ILayerHandlerContribution extends Releaseable {
     merge: (layerHandlers: ILayerHandlerContribution[]) => void;
     getContext: () => IContext2d;
     offscreen: boolean;
+    layer: ILayer;
 }

package/es/interface/layer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/layer.ts"],"names":[],"mappings":"","file":"layer.js","sourcesContent":["import type { IAABBBounds, IBounds, IBoundsLike } from '@visactor/vutils';\nimport type { IGraphic } from './graphic';\nimport type { IGroup } from './graphic/group';\nimport type { IColor } from './color';\nimport type { IDrawContext, IDrawContribution, IRenderService, IRenderServiceDrawParams } from './render';\nimport type { IStage } from './stage';\nimport type { Releaseable } from './common';\nimport type { IContext2d } from './context';\nimport type { IWindow } from './window';\n\nexport interface ILayerParams {\n  main: boolean;\n  zIndex?: number;\n  canvasId?: string;\n  virtual?: boolean;\n}\n\nexport interface ILayerDrawParams {\n  renderService: IRenderService;\n  background?: string | IColor;\n  updateBounds: boolean;\n}\n\nexport interface IDrawToParams {\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n  clear?: boolean;\n  renderService: IRenderService;\n  background?: string | IColor;\n  updateBounds: boolean;\n}\n\n// 不建议用户操作layer，尽量都通过stage实现\nexport interface ILayer extends IGroup {\n  parent: any;\n  // rootNode: IStage;\n  main: boolean;\n  width: number;\n  height: number;\n  viewWidth: number;\n  viewHeight: number;\n\n  readonly virtual: boolean;\n\n  offscreen: boolean;\n  subLayers: Map<number, { layer: ILayer; group?: IGroup; zIndex: number; drawContribution?: IDrawContribution }>;\n\n  // mode: 'dynamic' | 'static';\n  readonly dirtyBound: IAABBBounds;\n  background: string;\n  dpr: number;\n  opacity: number;\n  canvasId?: string;\n  imageData?: ImageData;\n  blendMode?: string;\n  // TODO: getElementById\n  pickable: boolean;\n  pick: (x: number, y: number) => { graphic?: IGraphic; group?: IGroup } | false;\n  render: (params: ILayerDrawParams, userParams?: Partial<IDrawContext>) => void;\n  afterDraw: (cb: (l: this) => void) => void;\n\n  resize: (w: number, h: number) => void;\n  resizeView: (w: number, h: number) => void;\n  setDpr: (dpr: number) => void;\n  getNativeHandler: () => ILayerHandlerContribution;\n  combineSubLayer: (removeIncrementalKey?: boolean) => void;\n\n  // 动画相关\n  startAnimate: (t: number) => void;\n  setToFrame: (t: number) => void;\n  prepare: (dirtyBounds: IBounds, params: ILayerHandlerDrawParams) => void;\n  drawTo: (target: IWindow, params: IDrawToParams) => void;\n  combineTo: (target: IWindow, params: IDrawToParams) => void;\n  // 考虑操作回放\n}\n\nexport interface ILayerHandlerDrawParams extends ILayerDrawParams {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  layer: ILayer;\n  stage: IStage;\n  updateBounds: boolean;\n}\n\nexport interface ILayerHandlerInitParams {\n  main: boolean;\n  canvasId?: string;\n  width: number;\n  height: number;\n  zIndex: number;\n  dpr?: number;\n}\n\n// TODO: layer在resize的时候需要判断是否需要resize window对应的canvas\n\n// 具体的Layer实现\n// Canvas2d的Layer可以对应一个Canvas或者ImageData\nexport interface ILayerHandlerContribution extends Releaseable {\n  init: (layer: ILayer, window: IWindow, params: ILayerHandlerInitParams) => void;\n  resize: (w: number, h: number) => void;\n  resizeView: (w: number, h: number) => void;\n  setDpr: (dpr: number) => void;\n  render: (group: IGroup[], params: ILayerHandlerDrawParams, userParams?: Partial<IDrawContext>) => void;\n  prepare: (dirtyBounds: IBoundsLike, params: IRenderServiceDrawParams) => void;\n  drawTo: (target: IWindow, group: IGroup[], params: IDrawToParams & ILayerHandlerDrawParams) => void;\n  merge: (layerHandlers: ILayerHandlerContribution[]) => void;\n  getContext: () => IContext2d;\n  offscreen: boolean;\n}\n"]}
+{"version":3,"sources":["../src/interface/layer.ts"],"names":[],"mappings":"","file":"layer.js","sourcesContent":["import type { IAABBBounds, IBounds, IBoundsLike } from '@visactor/vutils';\nimport type { IGraphic } from './graphic';\nimport type { IGroup } from './graphic/group';\nimport type { IColor } from './color';\nimport type { IDrawContext, IDrawContribution, IRenderService, IRenderServiceDrawParams } from './render';\nimport type { IStage } from './stage';\nimport type { Releaseable } from './common';\nimport type { IContext2d } from './context';\nimport type { IWindow } from './window';\nimport { ICanvasLike } from './canvas';\n\nexport type LayerMode = 'static' | 'dynamic' | 'virtual';\nexport interface ILayerParams {\n  main: boolean;\n  zIndex?: number;\n  layerMode: LayerMode;\n  layerHandler: ILayerHandlerContribution;\n  canvasId?: string;\n}\n\nexport interface ILayerDrawParams {\n  renderService: IRenderService;\n  background?: string | IColor;\n  updateBounds: boolean;\n}\n\nexport interface IDrawToParams {\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n  clear?: boolean;\n  renderService: IRenderService;\n  background?: string | IColor;\n  updateBounds: boolean;\n}\n\n// 不建议用户操作layer，尽量都通过stage实现\nexport interface ILayer extends IGroup {\n  parent: any;\n  // rootNode: IStage;\n  main: boolean;\n  width: number;\n  height: number;\n  viewWidth: number;\n  viewHeight: number;\n\n  readonly layerMode: LayerMode;\n  renderCount: number;\n\n  offscreen: boolean;\n  subLayers: Map<number, { layer: ILayer; group?: IGroup; zIndex: number; drawContribution?: IDrawContribution }>;\n\n  // mode: 'dynamic' | 'static';\n  readonly dirtyBound: IAABBBounds;\n  background: string;\n  dpr: number;\n  opacity: number;\n  canvasId?: string;\n  imageData?: ImageData;\n  blendMode?: string;\n  // TODO: getElementById\n  pickable: boolean;\n  pick: (x: number, y: number) => { graphic?: IGraphic; group?: IGroup } | false;\n  render: (params: ILayerDrawParams, userParams?: Partial<IDrawContext>) => void;\n  afterDraw: (cb: (l: this) => void) => void;\n\n  resize: (w: number, h: number) => void;\n  resizeView: (w: number, h: number) => void;\n  setDpr: (dpr: number) => void;\n  getNativeHandler: () => ILayerHandlerContribution;\n  combineSubLayer: (removeIncrementalKey?: boolean) => void;\n\n  // 动画相关\n  startAnimate: (t: number) => void;\n  setToFrame: (t: number) => void;\n  prepare: (dirtyBounds: IBounds, params: ILayerHandlerDrawParams) => void;\n  drawTo: (target: IWindow, params: IDrawToParams) => void;\n  combineTo: (target: IWindow, params: IDrawToParams) => void;\n  // 考虑操作回放\n}\n\nexport interface ILayerHandlerDrawParams extends ILayerDrawParams {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  layer: ILayer;\n  stage: IStage;\n  updateBounds: boolean;\n}\n\nexport interface ILayerHandlerInitParams {\n  main: boolean;\n  canvasId?: string;\n  width: number;\n  height: number;\n  zIndex: number;\n  dpr?: number;\n}\n\n// TODO: layer在resize的时候需要判断是否需要resize window对应的canvas\n\n// 具体的Layer实现\n// Canvas2d的Layer可以对应一个Canvas或者ImageData\nexport interface ILayerHandlerContribution extends Releaseable {\n  // 所绑定的副layer handler\n  secondaryHandlers?: ILayerHandlerContribution[];\n  // 所依赖的主layer handler\n  mainHandler?: ILayerHandlerContribution;\n  type: LayerMode;\n  init: (layer: ILayer, window: IWindow, params: ILayerHandlerInitParams) => void;\n  resize: (w: number, h: number) => void;\n  resizeView: (w: number, h: number) => void;\n  setDpr: (dpr: number) => void;\n  render: (group: IGroup[], params: ILayerHandlerDrawParams, userParams?: Partial<IDrawContext>) => void;\n  prepare: (dirtyBounds: IBoundsLike, params: IRenderServiceDrawParams) => void;\n  drawTo: (target: IWindow, group: IGroup[], params: IDrawToParams & ILayerHandlerDrawParams) => void;\n  merge: (layerHandlers: ILayerHandlerContribution[]) => void;\n  getContext: () => IContext2d;\n  offscreen: boolean;\n  layer: ILayer;\n}\n"]}

package/es/interface/picker.d.ts

@@ -5,8 +5,8 @@ import type { EnvType, IGlobal } from './global';
 import type { IGroup } from './graphic/group';
 import type { IDrawContribution } from './render';
 export type PickResult = {
-    graphic: IGraphic | null;
-    group: IGroup | null;
+    graphic?: IGraphic | null;
+    group?: IGroup | null;
     params?: {
         shadowTarget?: IGraphic;
     };
@@ -32,7 +32,7 @@ export interface IPickerService {
     configure: (global: IGlobal, env: EnvType) => void;
     pick: (group: IGraphic[], point: IPoint, params?: IPickParams) => PickResult;
     pickGroup: (group: IGroup, point: IPointLike, parentMatrix: IMatrix, params: IPickParams) => PickResult;
-    pickItem: (graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params?: IPickParams) => IGraphic | null;
+    pickItem: (graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params?: IPickParams) => PickResult | null;
     containsPoint: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;
     drawContribution?: IDrawContribution;
 }
@@ -42,12 +42,12 @@ export interface IPickItemInterceptorContribution {
         in3dInterceptor?: boolean;
     }, params?: {
         parentMatrix: IMatrix;
-    }) => boolean | PickResult | null;
+    }) => PickResult | null;
     afterPickItem?: (graphic: IGraphic, pickerService: IPickerService, point: IPointLike, drawContext: {
         in3dInterceptor?: boolean;
     }, params?: {
         parentMatrix: IMatrix;
-    }) => boolean | PickResult | null;
+    }) => PickResult | null;
 }
 export interface IBoundsPicker {
     type: string;

package/es/interface/picker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/picker.ts"],"names":[],"mappings":"","file":"picker.js","sourcesContent":["import type { IBounds, IMatrix, IPoint, IPointLike } from '@visactor/vutils';\nimport type { IGraphic } from './graphic';\nimport type { IContext2d } from './context';\nimport type { EnvType, IGlobal } from './global';\nimport type { IGroup } from './graphic/group';\nimport type { IDrawContribution } from './render';\n\nexport type PickResult = {\n  graphic: IGraphic | null;\n  group: IGroup | null;\n  params?: {\n    shadowTarget?: IGraphic;\n  };\n};\n\nexport interface IGraphicPicker {\n  type: string;\n  numberType: number;\n\n  contains: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n}\n\nexport interface IPickParams {\n  group?: boolean;\n  graphic?: boolean;\n  bounds?: IBounds;\n  pickContext?: IContext2d;\n  pickerService?: IPickerService;\n  // 内部设置\n  in3dInterceptor?: boolean;\n  hack_pieFace?: string;\n}\n\nexport interface IPickerService {\n  type: string;\n\n  pickContext?: IContext2d;\n  pickerMap: Map<number, IGraphicPicker>;\n  configure: (global: IGlobal, env: EnvType) => void;\n  pick: (group: IGraphic[], point: IPoint, params?: IPickParams) => PickResult;\n  pickGroup: (group: IGroup, point: IPointLike, parentMatrix: IMatrix, params: IPickParams) => PickResult;\n  pickItem: (\n    graphic: IGraphic,\n    point: IPointLike,\n    parentMatrix: IMatrix | null,\n    params?: IPickParams\n  ) => IGraphic | null;\n  containsPoint: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n  drawContribution?: IDrawContribution;\n}\n\nexport interface IPickItemInterceptorContribution {\n  order: number;\n  // null代表没匹配到，boolean代表是否pick中\n  beforePickItem?: (\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    drawContext: {\n      in3dInterceptor?: boolean;\n    },\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) => boolean | PickResult | null;\n\n  afterPickItem?: (\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    drawContext: {\n      in3dInterceptor?: boolean;\n    },\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) => boolean | PickResult | null;\n  // afterPickItem?: (\n  //   graphic: IGraphic,\n  //   pickerService: IPickerService,\n  // ) => boolean;\n}\n\nexport interface IBoundsPicker {\n  type: string;\n  numberType?: number;\n\n  contains: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n}\n"]}
+{"version":3,"sources":["../src/interface/picker.ts"],"names":[],"mappings":"","file":"picker.js","sourcesContent":["import type { IBounds, IMatrix, IPoint, IPointLike } from '@visactor/vutils';\nimport type { IGraphic } from './graphic';\nimport type { IContext2d } from './context';\nimport type { EnvType, IGlobal } from './global';\nimport type { IGroup } from './graphic/group';\nimport type { IDrawContribution } from './render';\n\nexport type PickResult = {\n  graphic?: IGraphic | null;\n  group?: IGroup | null;\n  params?: {\n    shadowTarget?: IGraphic;\n  };\n};\n\nexport interface IGraphicPicker {\n  type: string;\n  numberType: number;\n\n  contains: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n}\n\nexport interface IPickParams {\n  group?: boolean;\n  graphic?: boolean;\n  bounds?: IBounds;\n  pickContext?: IContext2d;\n  pickerService?: IPickerService;\n  // 内部设置\n  in3dInterceptor?: boolean;\n  hack_pieFace?: string;\n}\n\nexport interface IPickerService {\n  type: string;\n\n  pickContext?: IContext2d;\n  pickerMap: Map<number, IGraphicPicker>;\n  configure: (global: IGlobal, env: EnvType) => void;\n  pick: (group: IGraphic[], point: IPoint, params?: IPickParams) => PickResult;\n  pickGroup: (group: IGroup, point: IPointLike, parentMatrix: IMatrix, params: IPickParams) => PickResult;\n  pickItem: (\n    graphic: IGraphic,\n    point: IPointLike,\n    parentMatrix: IMatrix | null,\n    params?: IPickParams\n  ) => PickResult | null;\n  containsPoint: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n  drawContribution?: IDrawContribution;\n}\n\nexport interface IPickItemInterceptorContribution {\n  order: number;\n  // null代表没匹配到，boolean代表是否pick中\n  beforePickItem?: (\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    drawContext: {\n      in3dInterceptor?: boolean;\n    },\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) => PickResult | null;\n\n  afterPickItem?: (\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    drawContext: {\n      in3dInterceptor?: boolean;\n    },\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) => PickResult | null;\n  // afterPickItem?: (\n  //   graphic: IGraphic,\n  //   pickerService: IPickerService,\n  // ) => boolean;\n}\n\nexport interface IBoundsPicker {\n  type: string;\n  numberType?: number;\n\n  contains: (graphic: IGraphic, point: IPointLike, params?: IPickParams) => boolean;\n}\n"]}

package/es/interface/render.d.ts

@@ -11,7 +11,7 @@ import type { MaybePromise } from './common';
 import type { ISyncHook } from './sync-hook';
 export interface IRenderServiceDrawParams {
     context?: IContext2d;
-    clear?: string | IColor;
+    clear?: string | IColor | boolean;
     width: number;
     height: number;
     x: number;

package/es/interface/render.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/render.ts"],"names":[],"mappings":"","file":"render.js","sourcesContent":["import type { IAABBBounds, IBounds } from '@visactor/vutils';\nimport type { IColor } from './color';\nimport type { IContext2d } from './context';\nimport type { IGraphic, IGraphicAttribute } from './graphic';\nimport type { IMarkAttribute, IThemeAttribute } from './graphic/creator';\nimport type { IFullThemeSpec } from './graphic/theme';\nimport type { ILayer } from './layer';\nimport type { IStage } from './stage';\nimport type { IGroup } from './graphic/group';\nimport type { MaybePromise } from './common';\nimport type { ISyncHook } from './sync-hook';\n\n// 用于绘制的参数，提供context\n// TODO: 考虑是否可以隐藏上下文类型\nexport interface IRenderServiceDrawParams {\n  context?: IContext2d;\n\n  // 绘制的区域以及是否需要清屏\n  clear?: string | IColor;\n  width: number;\n  height: number;\n  x: number;\n  y: number;\n  stage: IStage;\n  layer: ILayer;\n  renderService: IRenderService;\n  updateBounds: boolean;\n  renderStyle?: string;\n}\n\nexport interface IRenderService {\n  dirtyBounds: IBounds;\n  renderTreeRoots: IGraphic[]; // 此次render的数组\n  renderLists: IGraphic[];\n  drawParams: IRenderServiceDrawParams;\n\n  prepare: (updateBounds: boolean) => void;\n  prepareRenderList: () => void;\n  beforeDraw: (params: IRenderServiceDrawParams) => void;\n  draw: (params: IRenderServiceDrawParams) => void;\n  afterDraw: (params: IRenderServiceDrawParams) => void;\n  render: (groups: IGroup[], params: IRenderServiceDrawParams) => MaybePromise<void>;\n}\n\nexport interface IDrawContext extends IRenderServiceDrawParams {\n  startAtId?: number;\n  break?: boolean;\n  restartIncremental?: boolean;\n  // multi图元开始的位置\n  multiGraphicOptions?: {\n    startAtIdx: number;\n    length: number;\n  };\n  in3dInterceptor?: boolean;\n  drawContribution?: IDrawContribution;\n  // hack内容\n  hack_pieFace?: 'inside' | 'bottom' | 'top' | 'outside';\n}\n\nexport interface IDrawContribution {\n  hooks?: {\n    completeDraw: ISyncHook<[]>;\n  };\n  dirtyBounds?: IAABBBounds;\n  backupDirtyBounds?: IAABBBounds;\n  rendering?: boolean;\n  currentRenderMap: Map<number, IGraphicRender>;\n  defaultRenderMap: Map<number, IGraphicRender>;\n  styleRenderMap: Map<string, Map<number, IGraphicRender>>;\n  draw: (renderService: IRenderService, drawParams: IDrawContext) => MaybePromise<void>;\n  afterDraw?: (renderService: IRenderService, drawParams: IDrawContext) => MaybePromise<void>;\n  getRenderContribution: (graphic: IGraphic) => IGraphicRender | null;\n  renderGroup: (group: IGroup, drawContext: IDrawContext, skipSort?: boolean) => void;\n  renderItem: (graphic: IGraphic, drawContext: IDrawContext, params?: IGraphicRenderDrawParams) => void;\n}\n\nexport interface IGraphicRenderDrawParams {\n  beforeDrawCb?: () => void;\n  afterDrawCb?: () => void;\n  drawingCb?: () => void;\n  skipDraw?: boolean;\n  theme?: IFullThemeSpec;\n}\n\nexport interface IGraphicRender {\n  type: string; // 图元类型\n  numberType: number;\n  style?: string;\n  z?: number;\n  draw: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    params?: IGraphicRenderDrawParams\n  ) => void;\n  drawShape?: (\n    graphic: IGraphic,\n    ctx: IContext2d,\n    x: number,\n    y: number,\n    drawContext: IDrawContext,\n    params?: IGraphicRenderDrawParams,\n    fillCb?: (\n      ctx: IContext2d,\n      markAttribute: Partial<IMarkAttribute & IGraphicAttribute>,\n      themeAttribute: IThemeAttribute\n    ) => boolean,\n    strokeCb?: (\n      ctx: IContext2d,\n      markAttribute: Partial<IMarkAttribute & IGraphicAttribute>,\n      themeAttribute: IThemeAttribute\n    ) => boolean\n  ) => void;\n}\n\nexport interface IBeforeRenderConstribution {\n  apply: (renderService: IRenderService) => MaybePromise<void>;\n}\n\nexport interface IRenderSelector {\n  selector: (graphic: IGraphic) => IGraphicRender | null;\n}\n\nexport interface IDrawItemInterceptorContribution {\n  order: number;\n  beforeDrawItem?: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    drawContribution: IDrawContribution,\n    params?: IGraphicRenderDrawParams\n  ) => boolean;\n  afterDrawItem?: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    drawContribution: IDrawContribution,\n    params?: IGraphicRenderDrawParams\n  ) => boolean;\n}\n"]}
+{"version":3,"sources":["../src/interface/render.ts"],"names":[],"mappings":"","file":"render.js","sourcesContent":["import type { IAABBBounds, IBounds } from '@visactor/vutils';\nimport type { IColor } from './color';\nimport type { IContext2d } from './context';\nimport type { IGraphic, IGraphicAttribute } from './graphic';\nimport type { IMarkAttribute, IThemeAttribute } from './graphic/creator';\nimport type { IFullThemeSpec } from './graphic/theme';\nimport type { ILayer } from './layer';\nimport type { IStage } from './stage';\nimport type { IGroup } from './graphic/group';\nimport type { MaybePromise } from './common';\nimport type { ISyncHook } from './sync-hook';\n\n// 用于绘制的参数，提供context\n// TODO: 考虑是否可以隐藏上下文类型\nexport interface IRenderServiceDrawParams {\n  context?: IContext2d;\n\n  // 绘制的区域以及是否需要清屏\n  clear?: string | IColor | boolean;\n  width: number;\n  height: number;\n  x: number;\n  y: number;\n  stage: IStage;\n  layer: ILayer;\n  renderService: IRenderService;\n  updateBounds: boolean;\n  renderStyle?: string;\n}\n\nexport interface IRenderService {\n  dirtyBounds: IBounds;\n  renderTreeRoots: IGraphic[]; // 此次render的数组\n  renderLists: IGraphic[];\n  drawParams: IRenderServiceDrawParams;\n\n  prepare: (updateBounds: boolean) => void;\n  prepareRenderList: () => void;\n  beforeDraw: (params: IRenderServiceDrawParams) => void;\n  draw: (params: IRenderServiceDrawParams) => void;\n  afterDraw: (params: IRenderServiceDrawParams) => void;\n  render: (groups: IGroup[], params: IRenderServiceDrawParams) => MaybePromise<void>;\n}\n\nexport interface IDrawContext extends IRenderServiceDrawParams {\n  startAtId?: number;\n  break?: boolean;\n  restartIncremental?: boolean;\n  // multi图元开始的位置\n  multiGraphicOptions?: {\n    startAtIdx: number;\n    length: number;\n  };\n  in3dInterceptor?: boolean;\n  drawContribution?: IDrawContribution;\n  // hack内容\n  hack_pieFace?: 'inside' | 'bottom' | 'top' | 'outside';\n}\n\nexport interface IDrawContribution {\n  hooks?: {\n    completeDraw: ISyncHook<[]>;\n  };\n  dirtyBounds?: IAABBBounds;\n  backupDirtyBounds?: IAABBBounds;\n  rendering?: boolean;\n  currentRenderMap: Map<number, IGraphicRender>;\n  defaultRenderMap: Map<number, IGraphicRender>;\n  styleRenderMap: Map<string, Map<number, IGraphicRender>>;\n  draw: (renderService: IRenderService, drawParams: IDrawContext) => MaybePromise<void>;\n  afterDraw?: (renderService: IRenderService, drawParams: IDrawContext) => MaybePromise<void>;\n  getRenderContribution: (graphic: IGraphic) => IGraphicRender | null;\n  renderGroup: (group: IGroup, drawContext: IDrawContext, skipSort?: boolean) => void;\n  renderItem: (graphic: IGraphic, drawContext: IDrawContext, params?: IGraphicRenderDrawParams) => void;\n}\n\nexport interface IGraphicRenderDrawParams {\n  beforeDrawCb?: () => void;\n  afterDrawCb?: () => void;\n  drawingCb?: () => void;\n  skipDraw?: boolean;\n  theme?: IFullThemeSpec;\n}\n\nexport interface IGraphicRender {\n  type: string; // 图元类型\n  numberType: number;\n  style?: string;\n  z?: number;\n  draw: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    params?: IGraphicRenderDrawParams\n  ) => void;\n  drawShape?: (\n    graphic: IGraphic,\n    ctx: IContext2d,\n    x: number,\n    y: number,\n    drawContext: IDrawContext,\n    params?: IGraphicRenderDrawParams,\n    fillCb?: (\n      ctx: IContext2d,\n      markAttribute: Partial<IMarkAttribute & IGraphicAttribute>,\n      themeAttribute: IThemeAttribute\n    ) => boolean,\n    strokeCb?: (\n      ctx: IContext2d,\n      markAttribute: Partial<IMarkAttribute & IGraphicAttribute>,\n      themeAttribute: IThemeAttribute\n    ) => boolean\n  ) => void;\n}\n\nexport interface IBeforeRenderConstribution {\n  apply: (renderService: IRenderService) => MaybePromise<void>;\n}\n\nexport interface IRenderSelector {\n  selector: (graphic: IGraphic) => IGraphicRender | null;\n}\n\nexport interface IDrawItemInterceptorContribution {\n  order: number;\n  beforeDrawItem?: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    drawContribution: IDrawContribution,\n    params?: IGraphicRenderDrawParams\n  ) => boolean;\n  afterDrawItem?: (\n    graphic: IGraphic,\n    renderService: IRenderService,\n    drawContext: IDrawContext,\n    drawContribution: IDrawContribution,\n    params?: IGraphicRenderDrawParams\n  ) => boolean;\n}\n"]}

package/es/interface/stage.d.ts

@@ -1,7 +1,5 @@
 import type { INode } from './node-tree';
-import type { ILayer } from './layer';
-import type { IGraphic } from './graphic';
-import type { IGroup } from './graphic/group';
+import type { ILayer, LayerMode } from './layer';
 import type { IColor } from './color';
 import type { IAABBBounds, IBounds, IBoundsLike, IMatrix } from '@visactor/vutils';
 import type { ICamera } from './camera';
@@ -10,7 +8,7 @@ import type { IDirectionLight } from './light';
 import type { ISyncHook } from './sync-hook';
 import type { IDrawContext, IRenderService } from './render';
 import type { ITicker, ITimeline } from './animate';
-import type { IPickerService } from './picker';
+import type { IPickerService, PickResult } from './picker';
 import type { IPluginService } from './plugin';
 import type { IWindow } from './window';
 import type { ILayerService } from './core';
@@ -30,6 +28,7 @@ export interface IStageParams {
     disableDirtyBounds: boolean;
     interactiveLayer: boolean;
     enableHtmlAttribute: string | boolean | HTMLElement;
+    enableScroll: boolean;
     poptip: boolean;
     beforeRender: (stage: IStage) => void;
     afterRender: (stage: IStage) => void;
@@ -95,13 +94,13 @@ export interface IStage extends INode {
     readonly pickerService: IPickerService;
     readonly pluginService: IPluginService;
     readonly layerService: ILayerService;
-    createLayer: (canvasId?: string) => ILayer;
+    createLayer: (canvasId?: string, layerMode?: LayerMode) => ILayer;
     getLayer: (name: string) => ILayer;
     sortLayer: (cb: (layer1: ILayer, layer2: ILayer) => number) => void;
     removeLayer: (layerId: number) => ILayer | false;
     getTimeline: () => ITimeline;
     render: (layers?: ILayer[], params?: Partial<IDrawContext>) => void;
-    renderNextFrame: (layers?: ILayer[]) => void;
+    renderNextFrame: (layers?: ILayer[], force?: boolean) => void;
     tryInitInteractiveLayer: () => void;
     resize: (w: number, h: number, rerender?: boolean) => void;
     resizeWindow: (w: number, h: number, rerender?: boolean) => void;
@@ -110,10 +109,7 @@ export interface IStage extends INode {
     setDpr: (dpr: number, rerender?: boolean) => void;
     setOrigin: (x: number, y: number) => void;
     export: (type: IExportType) => HTMLCanvasElement | ImageData;
-    pick: (x: number, y: number) => {
-        graphic: IGraphic | null;
-        group: IGroup | null;
-    } | false;
+    pick: (x: number, y: number) => PickResult | false;
     startAnimate: (t: number) => void;
     setToFrame: (t: number) => void;
     dirty: (b: IBounds, matrix?: IMatrix) => void;

package/es/interface/stage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/stage.ts"],"names":[],"mappings":"","file":"stage.js","sourcesContent":["import type { INode } from './node-tree';\nimport type { ILayer } from './layer';\nimport type { IGraphic } from './graphic';\nimport type { IGroup } from './graphic/group';\nimport type { IColor } from './color';\nimport type { IAABBBounds, IBounds, IBoundsLike, IMatrix, IPointLike } from '@visactor/vutils';\nimport type { ICamera } from './camera';\nimport type { vec3 } from './matrix';\nimport type { IDirectionLight } from './light';\nimport type { ISyncHook } from './sync-hook';\nimport type { IDrawContext, IRenderService } from './render';\nimport type { ITicker, ITimeline } from './animate';\nimport type { IPickerService } from './picker';\nimport type { IPluginService } from './plugin';\nimport type { IWindow } from './window';\nimport type { ILayerService } from './core';\n\nexport type IExportType = 'canvas' | 'imageData';\n\nexport interface IStageParams {\n  // x: number;\n  // y: number;\n  // // 视口的宽高\n  // viewWidth: number;\n  // viewHeight: number;\n\n  // 视口的宽高\n  viewBox: IBoundsLike;\n  // 总的宽高\n  width: number;\n  height: number;\n  dpr: number;\n  // stage的背景\n  background: string | IColor;\n  // 外部的canvas\n  canvas: string | HTMLCanvasElement;\n  // canvas的container容器，如果不传入canvas，那就会在容器中创建canvas\n  container: string | HTMLElement;\n  // 是否是受控制的canvas，如果不是的话，不会进行resize等操作，也不会修改canvas的样式\n  canvasControled: boolean;\n  title: string;\n  // 是否开启自动渲染\n  autoRender: boolean;\n  // 是否开启布局支持\n  enableLayout: boolean;\n  // 是否关闭脏矩形检测\n  disableDirtyBounds: boolean;\n  // 是否支持interactiveLayer，默认为true\n  interactiveLayer: boolean;\n  // 是否支持HTML属性\n  enableHtmlAttribute: string | boolean | HTMLElement;\n  poptip: boolean;\n  // 绘制之前的钩子函数\n  beforeRender: (stage: IStage) => void;\n  // 绘制之后的钩子函数\n  afterRender: (stage: IStage) => void;\n  renderStyle?: string;\n  ticker?: ITicker;\n  pluginList?: string[];\n  // 优化配置\n  optimize?: IOptimizeType;\n}\n\nexport type IOptimizeType = {\n  // 视口不在可视区，跳过渲染，默认为true\n  skipRenderWithOutRange?: boolean;\n};\n\nexport interface IOption3D {\n  enableView3dTransform?: boolean; // 是否开启view3d自动旋转\n  alpha?: number; // x轴的转角\n  beta?: number; // y轴的转角\n  gama?: number; // z轴的转角\n  center?: { x?: number; y?: number; z?: number; dx?: number; dy?: number; dz?: number }; // 中心位置\n  fieldRatio?: number; // 透视的视域缩放比例\n  fieldDepth?: number;\n  light?: {\n    dir?: vec3;\n    color?: string;\n    ambient?: number;\n  };\n  // 配置相机后，alpha、beta、gamma配置会失效\n  camera?: any; // 相机配置\n}\n\n// TODO 命名方式\nexport interface IStage extends INode {\n  stage?: IStage;\n  parent: IStage | null;\n  // rootNode: IStage;\n  x: number;\n  y: number;\n\n  params: Partial<IStageParams>;\n\n  window: IWindow;\n\n  width: number;\n  height: number;\n  viewWidth: number;\n  viewHeight: number;\n  defaultLayer: ILayer;\n  dirtyBounds: IBounds | null;\n\n  autoRender: boolean;\n  renderCount: number;\n\n  hooks: {\n    beforeRender: ISyncHook<[IStage]>;\n    afterRender: ISyncHook<[IStage]>;\n  };\n\n  option3d?: IOption3D;\n\n  set3dOptions: (options: IOption3D) => void;\n  light?: IDirectionLight;\n  camera?: ICamera;\n\n  dpr: number;\n\n  viewBox: IBoundsLike;\n  background: string | IColor;\n  ticker: ITicker;\n  increaseAutoRender: boolean;\n  readonly renderService: IRenderService;\n  readonly pickerService: IPickerService;\n  readonly pluginService: IPluginService;\n  readonly layerService: ILayerService;\n  // 如果传入CanvasId，如果存在相同Id，说明这两个图层使用相同的Canvas绘制\n  // 但需要注意的是依然是两个图层（用于解决Table嵌入ChartSpace不影响Table的绘制）\n  createLayer: (canvasId?: string) => ILayer;\n  getLayer: (name: string) => ILayer;\n  sortLayer: (cb: (layer1: ILayer, layer2: ILayer) => number) => void;\n  removeLayer: (layerId: number) => ILayer | false;\n\n  getTimeline: () => ITimeline;\n\n  render: (layers?: ILayer[], params?: Partial<IDrawContext>) => void;\n  renderNextFrame: (layers?: ILayer[]) => void;\n  tryInitInteractiveLayer: () => void;\n\n  // 画布操作\n  resize: (w: number, h: number, rerender?: boolean) => void;\n  resizeWindow: (w: number, h: number, rerender?: boolean) => void;\n  resizeView: (w: number, h: number, rerender?: boolean) => void;\n  setViewBox:\n    | ((viewBox: IBoundsLike, rerender: boolean) => void)\n    | ((x: number, y: number, w: number, h: number, rerender: boolean) => void)\n    | ((x: number | IBoundsLike, y: number | boolean, w?: number, h?: number, rerender?: boolean) => void);\n  setDpr: (dpr: number, rerender?: boolean) => void;\n  setOrigin: (x: number, y: number) => void;\n  export: (type: IExportType) => HTMLCanvasElement | ImageData;\n  pick: (x: number, y: number) => { graphic: IGraphic | null; group: IGroup | null } | false;\n\n  // 动画相关\n  startAnimate: (t: number) => void;\n  setToFrame: (t: number) => void;\n  dirty: (b: IBounds, matrix?: IMatrix) => void;\n  // 考虑操作回放\n\n  renderTo: (window: IWindow, params: { x: number; y: number; width: number; height: number }) => void;\n\n  renderToNewWindow: (fullImage?: boolean) => IWindow;\n\n  toCanvas: (fullImage?: boolean, viewBox?: IAABBBounds) => HTMLCanvasElement | null;\n\n  setBeforeRender: (cb: (stage: IStage) => void) => void;\n\n  setAfterRender: (cb: (stage: IStage) => void) => void;\n\n  afterNextRender: (cb: (stage: IStage) => void) => void;\n  enableAutoRender: () => void;\n  disableAutoRender: () => void;\n  enableIncrementalAutoRender: () => void;\n  disableIncrementalAutoRender: () => void;\n  enableDirtyBounds: () => void;\n  disableDirtyBounds: () => void;\n  enableView3dTransform: () => void;\n  disableView3dTranform: () => void;\n  clearViewBox: (color?: string) => void;\n  release: () => void;\n  setStage: (stage?: IStage) => void;\n\n  setCursor: (mode?: string) => void;\n}\n\nexport declare function combineStage(srages: IStage[], params: { canvas: string | HTMLCanvasElement }): IStage;\n"]}
+{"version":3,"sources":["../src/interface/stage.ts"],"names":[],"mappings":"","file":"stage.js","sourcesContent":["import type { INode } from './node-tree';\nimport type { ILayer, LayerMode } from './layer';\nimport type { IGraphic } from './graphic';\nimport type { IGroup } from './graphic/group';\nimport type { IColor } from './color';\nimport type { IAABBBounds, IBounds, IBoundsLike, IMatrix, IPointLike } from '@visactor/vutils';\nimport type { ICamera } from './camera';\nimport type { vec3 } from './matrix';\nimport type { IDirectionLight } from './light';\nimport type { ISyncHook } from './sync-hook';\nimport type { IDrawContext, IRenderService } from './render';\nimport type { ITicker, ITimeline } from './animate';\nimport type { IPickerService, PickResult } from './picker';\nimport type { IPluginService } from './plugin';\nimport type { IWindow } from './window';\nimport type { ILayerService } from './core';\n\nexport type IExportType = 'canvas' | 'imageData';\n\nexport interface IStageParams {\n  // x: number;\n  // y: number;\n  // // 视口的宽高\n  // viewWidth: number;\n  // viewHeight: number;\n\n  // 视口的宽高\n  viewBox: IBoundsLike;\n  // 总的宽高\n  width: number;\n  height: number;\n  dpr: number;\n  // stage的背景\n  background: string | IColor;\n  // 外部的canvas\n  canvas: string | HTMLCanvasElement;\n  // canvas的container容器，如果不传入canvas，那就会在容器中创建canvas\n  container: string | HTMLElement;\n  // 是否是受控制的canvas，如果不是的话，不会进行resize等操作，也不会修改canvas的样式\n  canvasControled: boolean;\n  title: string;\n  // 是否开启自动渲染\n  autoRender: boolean;\n  // 是否开启布局支持\n  enableLayout: boolean;\n  // 是否关闭脏矩形检测\n  disableDirtyBounds: boolean;\n  // 是否支持interactiveLayer，默认为true\n  interactiveLayer: boolean;\n  // 是否支持HTML属性\n  enableHtmlAttribute: string | boolean | HTMLElement;\n  // 是否支持滚动条\n  enableScroll: boolean;\n  poptip: boolean;\n  // 绘制之前的钩子函数\n  beforeRender: (stage: IStage) => void;\n  // 绘制之后的钩子函数\n  afterRender: (stage: IStage) => void;\n  renderStyle?: string;\n  ticker?: ITicker;\n  pluginList?: string[];\n  // 优化配置\n  optimize?: IOptimizeType;\n}\n\nexport type IOptimizeType = {\n  // 视口不在可视区，跳过渲染，默认为true\n  skipRenderWithOutRange?: boolean;\n};\n\nexport interface IOption3D {\n  enableView3dTransform?: boolean; // 是否开启view3d自动旋转\n  alpha?: number; // x轴的转角\n  beta?: number; // y轴的转角\n  gama?: number; // z轴的转角\n  center?: { x?: number; y?: number; z?: number; dx?: number; dy?: number; dz?: number }; // 中心位置\n  fieldRatio?: number; // 透视的视域缩放比例\n  fieldDepth?: number;\n  light?: {\n    dir?: vec3;\n    color?: string;\n    ambient?: number;\n  };\n  // 配置相机后，alpha、beta、gamma配置会失效\n  camera?: any; // 相机配置\n}\n\n// TODO 命名方式\nexport interface IStage extends INode {\n  stage?: IStage;\n  parent: IStage | null;\n  // rootNode: IStage;\n  x: number;\n  y: number;\n\n  params: Partial<IStageParams>;\n\n  window: IWindow;\n\n  width: number;\n  height: number;\n  viewWidth: number;\n  viewHeight: number;\n  defaultLayer: ILayer;\n  dirtyBounds: IBounds | null;\n\n  autoRender: boolean;\n  renderCount: number;\n\n  hooks: {\n    beforeRender: ISyncHook<[IStage]>;\n    afterRender: ISyncHook<[IStage]>;\n  };\n\n  option3d?: IOption3D;\n\n  set3dOptions: (options: IOption3D) => void;\n  light?: IDirectionLight;\n  camera?: ICamera;\n\n  dpr: number;\n\n  viewBox: IBoundsLike;\n  background: string | IColor;\n  ticker: ITicker;\n  increaseAutoRender: boolean;\n  readonly renderService: IRenderService;\n  readonly pickerService: IPickerService;\n  readonly pluginService: IPluginService;\n  readonly layerService: ILayerService;\n  // 如果传入CanvasId，如果存在相同Id，说明这两个图层使用相同的Canvas绘制\n  // 但需要注意的是依然是两个图层（用于解决Table嵌入ChartSpace不影响Table的绘制）\n  createLayer: (canvasId?: string, layerMode?: LayerMode) => ILayer;\n  getLayer: (name: string) => ILayer;\n  sortLayer: (cb: (layer1: ILayer, layer2: ILayer) => number) => void;\n  removeLayer: (layerId: number) => ILayer | false;\n\n  getTimeline: () => ITimeline;\n\n  render: (layers?: ILayer[], params?: Partial<IDrawContext>) => void;\n  /**\n   * 下一帧渲染\n   * @param layers 渲染的图层\n   * @param force 是否强行下一帧渲染，不采取优化方案\n   * @returns\n   */\n  renderNextFrame: (layers?: ILayer[], force?: boolean) => void;\n  tryInitInteractiveLayer: () => void;\n\n  // 画布操作\n  resize: (w: number, h: number, rerender?: boolean) => void;\n  resizeWindow: (w: number, h: number, rerender?: boolean) => void;\n  resizeView: (w: number, h: number, rerender?: boolean) => void;\n  setViewBox:\n    | ((viewBox: IBoundsLike, rerender: boolean) => void)\n    | ((x: number, y: number, w: number, h: number, rerender: boolean) => void)\n    | ((x: number | IBoundsLike, y: number | boolean, w?: number, h?: number, rerender?: boolean) => void);\n  setDpr: (dpr: number, rerender?: boolean) => void;\n  setOrigin: (x: number, y: number) => void;\n  export: (type: IExportType) => HTMLCanvasElement | ImageData;\n  pick: (x: number, y: number) => PickResult | false;\n\n  // 动画相关\n  startAnimate: (t: number) => void;\n  setToFrame: (t: number) => void;\n  dirty: (b: IBounds, matrix?: IMatrix) => void;\n  // 考虑操作回放\n\n  renderTo: (window: IWindow, params: { x: number; y: number; width: number; height: number }) => void;\n\n  renderToNewWindow: (fullImage?: boolean) => IWindow;\n\n  toCanvas: (fullImage?: boolean, viewBox?: IAABBBounds) => HTMLCanvasElement | null;\n\n  setBeforeRender: (cb: (stage: IStage) => void) => void;\n\n  setAfterRender: (cb: (stage: IStage) => void) => void;\n\n  afterNextRender: (cb: (stage: IStage) => void) => void;\n  enableAutoRender: () => void;\n  disableAutoRender: () => void;\n  enableIncrementalAutoRender: () => void;\n  disableIncrementalAutoRender: () => void;\n  enableDirtyBounds: () => void;\n  disableDirtyBounds: () => void;\n  enableView3dTransform: () => void;\n  disableView3dTranform: () => void;\n  clearViewBox: (color?: string) => void;\n  release: () => void;\n  setStage: (stage?: IStage) => void;\n\n  setCursor: (mode?: string) => void;\n}\n\nexport declare function combineStage(srages: IStage[], params: { canvas: string | HTMLCanvasElement }): IStage;\n"]}

package/es/picker/global-picker-service.d.ts

@@ -9,5 +9,5 @@ export declare class DefaultGlobalPickerService implements IPickerService {
     pick(graphics: IGraphic[], point: IPointLike, params?: IPickParams): PickResult;
     containsPoint(graphic: IGraphic, point: IPointLike, params?: IPickParams): boolean;
     pickGroup(group: IGroup, point: IPointLike, parentMatrix: IMatrix, params?: IPickParams): PickResult;
-    pickItem(graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params?: IPickParams): IGraphic | null;
+    pickItem(graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params?: IPickParams): PickResult | null;
 }

package/es/picker/global-picker-service.js

@@ -30,8 +30,14 @@ let DefaultGlobalPickerService = class {
         };
         const parentMatrix = new Matrix(1, 0, 0, 1, 0, 0);
         let group;
-        for (let i = 0; i < graphics.length && (graphics[i].isContainer ? result = this.pickGroup(graphics[i], point, parentMatrix, params) : result.graphic = this.pickItem(graphics[i], point, parentMatrix, params), 
-        !result.graphic); i++) group || (group = result.group);
+        for (let i = 0; i < graphics.length; i++) {
+            if (graphics[i].isContainer) result = this.pickGroup(graphics[i], point, parentMatrix, params); else {
+                const data = this.pickItem(graphics[i], point, parentMatrix, params);
+                data && (result.graphic = data.graphic, result.params = data.params);
+            }
+            if (result.graphic) break;
+            group || (group = result.group);
+        }
         if (result.graphic || (result.group = group), result.graphic) {
             let g = result.graphic;
             for (;g.parent; ) g = g.parent;
@@ -59,13 +65,17 @@ let DefaultGlobalPickerService = class {
         !1 !== group.attribute.childrenPickable && group.forEachChildren((graphic => {
             if (graphic.isContainer) result = this.pickGroup(graphic, point, parentMatrix, params); else {
                 const newPoint = new Point(point.x, point.y);
-                parentMatrix.transformPoint(newPoint, newPoint), result.graphic = this.pickItem(graphic, newPoint, parentMatrix, params);
+                parentMatrix.transformPoint(newPoint, newPoint);
+                const data = this.pickItem(graphic, newPoint, parentMatrix, params);
+                data && (result.graphic = data.graphic, result.params = data.params);
             }
             return !!result.graphic || !!result.group;
         })), result.graphic || result.group || !groupPicked || (result.group = group), result;
     }
     pickItem(graphic, point, parentMatrix, params) {
-        return !1 === graphic.attribute.pickable ? null : graphic.AABBBounds.containsPoint(point) ? graphic : null;
+        return !1 === graphic.attribute.pickable ? null : graphic.AABBBounds.containsPoint(point) ? {
+            graphic: graphic
+        } : null;
     }
 };
 

package/es/picker/global-picker-service.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/picker/global-picker-service.ts"],"names":[],"mappings":"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","file":"global-picker-service.js","sourcesContent":["import type { IMatrix, IPoint, IPointLike } from '@visactor/vutils';\nimport { Matrix, Point } from '@visactor/vutils';\nimport { inject, injectable } from '../common/inversify-lite';\nimport type {\n  IGraphic,\n  IGroup,\n  EnvType,\n  IGlobal,\n  IPickerService,\n  IGraphicPicker,\n  IPickParams,\n  PickResult\n} from '../interface';\nimport { VGlobal } from '../constants';\n\n// 默认的pick-service，提供基本的最优选中策略，尽量不需要用户自己实现contribution\n// 用户可以写plugin\n@injectable()\nexport class DefaultGlobalPickerService implements IPickerService {\n  type: 'global';\n\n  declare pickerMap: Map<number, IGraphicPicker>;\n\n  constructor(\n    // @inject(ContributionProvider)\n    // @named(PickerContribution)\n    // protected readonly contributions: ContributionProvider<IPickerContribution>,\n    @inject(VGlobal) public readonly global: IGlobal\n  ) {\n    this.global.hooks.onSetEnv.tap('global-picker-service', (lastEnv, env, global) => {\n      this.configure(global, env);\n    });\n    this.configure(this.global, this.global.env);\n  }\n\n  configure(global: IGlobal, env: EnvType) {\n    // if (!this.global.env) return;\n    // this.contributions.getContributions().forEach(handlerContribution => {\n    //   handlerContribution.configure(this, this.global);\n    // });\n  }\n\n  // todo: params支持\n  // todo: 性能优化\n  pick(graphics: IGraphic[], point: IPointLike, params?: IPickParams): PickResult {\n    let result: PickResult = {\n      graphic: null,\n      group: null\n    };\n    const parentMatrix = new Matrix(1, 0, 0, 1, 0, 0);\n    let group: IGroup;\n    for (let i = 0; i < graphics.length; i++) {\n      if (graphics[i].isContainer) {\n        result = this.pickGroup(graphics[i] as IGroup, point, parentMatrix, params);\n      } else {\n        result.graphic = this.pickItem(graphics[i], point, parentMatrix, params);\n      }\n      if (result.graphic) {\n        break;\n      }\n      if (!group) {\n        group = result.group;\n      }\n    }\n    if (!result.graphic) {\n      result.group = group;\n    }\n    // 判断是否有shadow-dom\n    if (result.graphic) {\n      let g = result.graphic;\n      while (g.parent) {\n        g = g.parent;\n      }\n      if (g.shadowHost) {\n        result.params = {\n          shadowTarget: result.graphic\n        };\n        result.graphic = g.shadowHost;\n      }\n    }\n    return result;\n  }\n\n  containsPoint(graphic: IGraphic, point: IPointLike, params?: IPickParams): boolean {\n    return !!this.pickItem(graphic, point, null, params);\n  }\n\n  pickGroup(group: IGroup, point: IPointLike, parentMatrix: IMatrix, params?: IPickParams): PickResult {\n    let result: PickResult = {\n      group: null,\n      graphic: null\n    };\n    if (group.attribute.visibleAll === false) {\n      return result;\n    }\n    // 转换坐标空间\n    const transMatrix = group.transMatrix;\n\n    const newPoint: IPoint = new Point(point.x, point.y);\n    parentMatrix.transformPoint(newPoint, newPoint);\n    const insideGroup = group.AABBBounds.containsPoint(newPoint);\n    // 如果group没有被选中，直接跳过\n    if (!insideGroup) {\n      return result;\n    }\n    // todo: 支持带有path的group的选中\n    const groupPicked = group.attribute.pickable !== false && insideGroup;\n\n    parentMatrix.multiply(transMatrix.a, transMatrix.b, transMatrix.c, transMatrix.d, transMatrix.e, transMatrix.f);\n\n    if (group.attribute.childrenPickable !== false) {\n      group.forEachChildren((graphic: IGraphic) => {\n        if (graphic.isContainer) {\n          result = this.pickGroup(graphic as IGroup, point, parentMatrix, params);\n        } else {\n          const newPoint: IPoint = new Point(point.x, point.y);\n          parentMatrix.transformPoint(newPoint, newPoint);\n          result.graphic = this.pickItem(graphic, newPoint, parentMatrix, params);\n        }\n        return !!result.graphic || !!result.group;\n      });\n    }\n\n    if (!result.graphic && !result.group && groupPicked) {\n      result.group = group;\n    }\n\n    return result;\n  }\n\n  // todo: switch统一改为数字map\n  pickItem(graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params?: IPickParams): IGraphic | null {\n    if (graphic.attribute.pickable === false) {\n      return null;\n    }\n    if (graphic.AABBBounds.containsPoint(point)) {\n      return graphic;\n    }\n    return null;\n  }\n}\n"]}
+{"version":3,"sources":["../src/picker/global-picker-service.ts"],"names":[],"mappings":"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","file":"global-picker-service.js","sourcesContent":["import type { IMatrix, IPoint, IPointLike } from '@visactor/vutils';\nimport { Matrix, Point } from '@visactor/vutils';\nimport { inject, injectable } from '../common/inversify-lite';\nimport type {\n  IGraphic,\n  IGroup,\n  EnvType,\n  IGlobal,\n  IPickerService,\n  IGraphicPicker,\n  IPickParams,\n  PickResult\n} from '../interface';\nimport { VGlobal } from '../constants';\n\n// 默认的pick-service，提供基本的最优选中策略，尽量不需要用户自己实现contribution\n// 用户可以写plugin\n@injectable()\nexport class DefaultGlobalPickerService implements IPickerService {\n  type: 'global';\n\n  declare pickerMap: Map<number, IGraphicPicker>;\n\n  constructor(\n    // @inject(ContributionProvider)\n    // @named(PickerContribution)\n    // protected readonly contributions: ContributionProvider<IPickerContribution>,\n    @inject(VGlobal) public readonly global: IGlobal\n  ) {\n    this.global.hooks.onSetEnv.tap('global-picker-service', (lastEnv, env, global) => {\n      this.configure(global, env);\n    });\n    this.configure(this.global, this.global.env);\n  }\n\n  configure(global: IGlobal, env: EnvType) {\n    // if (!this.global.env) return;\n    // this.contributions.getContributions().forEach(handlerContribution => {\n    //   handlerContribution.configure(this, this.global);\n    // });\n  }\n\n  // todo: params支持\n  // todo: 性能优化\n  pick(graphics: IGraphic[], point: IPointLike, params?: IPickParams): PickResult {\n    let result: PickResult = {\n      graphic: null,\n      group: null\n    };\n    const parentMatrix = new Matrix(1, 0, 0, 1, 0, 0);\n    let group: IGroup;\n    for (let i = 0; i < graphics.length; i++) {\n      if (graphics[i].isContainer) {\n        result = this.pickGroup(graphics[i] as IGroup, point, parentMatrix, params);\n      } else {\n        const data = this.pickItem(graphics[i], point, parentMatrix, params);\n        if (data) {\n          result.graphic = data.graphic;\n          result.params = data.params;\n        }\n      }\n      if (result.graphic) {\n        break;\n      }\n      if (!group) {\n        group = result.group;\n      }\n    }\n    if (!result.graphic) {\n      result.group = group;\n    }\n    // 判断是否有shadow-dom\n    if (result.graphic) {\n      let g = result.graphic;\n      while (g.parent) {\n        g = g.parent;\n      }\n      if (g.shadowHost) {\n        result.params = {\n          shadowTarget: result.graphic\n        };\n        result.graphic = g.shadowHost;\n      }\n    }\n    return result;\n  }\n\n  containsPoint(graphic: IGraphic, point: IPointLike, params?: IPickParams): boolean {\n    return !!this.pickItem(graphic, point, null, params);\n  }\n\n  pickGroup(group: IGroup, point: IPointLike, parentMatrix: IMatrix, params?: IPickParams): PickResult {\n    let result: PickResult = {\n      group: null,\n      graphic: null\n    };\n    if (group.attribute.visibleAll === false) {\n      return result;\n    }\n    // 转换坐标空间\n    const transMatrix = group.transMatrix;\n\n    const newPoint: IPoint = new Point(point.x, point.y);\n    parentMatrix.transformPoint(newPoint, newPoint);\n    const insideGroup = group.AABBBounds.containsPoint(newPoint);\n    // 如果group没有被选中，直接跳过\n    if (!insideGroup) {\n      return result;\n    }\n    // todo: 支持带有path的group的选中\n    const groupPicked = group.attribute.pickable !== false && insideGroup;\n\n    parentMatrix.multiply(transMatrix.a, transMatrix.b, transMatrix.c, transMatrix.d, transMatrix.e, transMatrix.f);\n\n    if (group.attribute.childrenPickable !== false) {\n      group.forEachChildren((graphic: IGraphic) => {\n        if (graphic.isContainer) {\n          result = this.pickGroup(graphic as IGroup, point, parentMatrix, params);\n        } else {\n          const newPoint: IPoint = new Point(point.x, point.y);\n          parentMatrix.transformPoint(newPoint, newPoint);\n          const data = this.pickItem(graphic, newPoint, parentMatrix, params);\n          if (data) {\n            result.graphic = data.graphic;\n            result.params = data.params;\n          }\n        }\n        return !!result.graphic || !!result.group;\n      });\n    }\n\n    if (!result.graphic && !result.group && groupPicked) {\n      result.group = group;\n    }\n\n    return result;\n  }\n\n  // todo: switch统一改为数字map\n  pickItem(\n    graphic: IGraphic,\n    point: IPointLike,\n    parentMatrix: IMatrix | null,\n    params?: IPickParams\n  ): PickResult | null {\n    if (graphic.attribute.pickable === false) {\n      return null;\n    }\n    if (graphic.AABBBounds.containsPoint(point)) {\n      return {\n        graphic: graphic\n      };\n    }\n    return null;\n  }\n}\n"]}

package/es/picker/pick-interceptor.d.ts

@@ -5,13 +5,19 @@ export declare class ShadowRootPickItemInterceptorContribution implements IPickI
     order: number;
     afterPickItem(graphic: IGraphic, pickerService: IPickerService, point: IPointLike, pickParams: IPickParams, params?: {
         parentMatrix: IMatrix;
-    }): boolean | PickResult;
+    }): null | PickResult;
     beforePickItem(graphic: IGraphic, pickerService: IPickerService, point: IPointLike, pickParams: IPickParams, params?: {
         parentMatrix: IMatrix;
-    }): boolean | PickResult;
+    }): null | PickResult;
     protected _pickItem(graphic: IGraphic, pickerService: IPickerService, point: IPointLike, pickParams: IPickParams, params?: {
         parentMatrix: IMatrix;
-    }): boolean | PickResult;
+    }): PickResult | null;
+}
+export declare class InteractivePickItemInterceptorContribution implements IPickItemInterceptorContribution {
+    order: number;
+    beforePickItem(graphic: IGraphic, pickerService: IPickerService, point: IPointLike, pickParams: IPickParams, params?: {
+        parentMatrix: IMatrix;
+    }): null | PickResult;
 }
 export declare class Canvas3DPickItemInterceptor implements IPickItemInterceptorContribution {
     order: number;

package/es/picker/pick-interceptor.js

@@ -19,15 +19,15 @@ let ShadowRootPickItemInterceptorContribution = class {
         this.order = 1;
     }
     afterPickItem(graphic, pickerService, point, pickParams, params) {
-        return (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) && this._pickItem(graphic, pickerService, point, pickParams, params);
+        return graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx ? this._pickItem(graphic, pickerService, point, pickParams, params) : null;
     }
     beforePickItem(graphic, pickerService, point, pickParams, params) {
-        return graphic.attribute.shadowRootIdx < 0 && this._pickItem(graphic, pickerService, point, pickParams, params);
+        return graphic.attribute.shadowRootIdx < 0 ? this._pickItem(graphic, pickerService, point, pickParams, params) : null;
     }
     _pickItem(graphic, pickerService, point, pickParams, params) {
-        if (!graphic.shadowRoot) return !1;
+        if (!graphic.shadowRoot) return null;
         const {parentMatrix: parentMatrix} = params || {};
-        if (!parentMatrix) return !1;
+        if (!parentMatrix) return null;
         const context = pickerService.pickContext;
         context.highPerformanceSave();
         const g = graphic.shadowRoot, currentGroupMatrix = matrixAllocate.allocateByObj(parentMatrix), newPoint = new Point(point.x, point.y);
@@ -43,6 +43,28 @@ ShadowRootPickItemInterceptorContribution = __decorate([ injectable() ], ShadowR
 
 export { ShadowRootPickItemInterceptorContribution };
 
+let InteractivePickItemInterceptorContribution = class {
+    constructor() {
+        this.order = 1;
+    }
+    beforePickItem(graphic, pickerService, point, pickParams, params) {
+        const originGraphic = graphic.baseGraphic;
+        if (originGraphic && originGraphic.parent) {
+            const newPoint = new Point(point.x, point.y), context = pickerService.pickContext;
+            context.highPerformanceSave();
+            const parentMatrix = originGraphic.parent.globalTransMatrix;
+            parentMatrix.transformPoint(newPoint, newPoint);
+            const result = originGraphic.isContainer ? pickerService.pickGroup(originGraphic, newPoint.clone(), parentMatrix, pickParams) : pickerService.pickItem(originGraphic, newPoint.clone(), parentMatrix, pickParams);
+            return context.highPerformanceRestore(), result;
+        }
+        return null;
+    }
+};
+
+InteractivePickItemInterceptorContribution = __decorate([ injectable() ], InteractivePickItemInterceptorContribution);
+
+export { InteractivePickItemInterceptorContribution };
+
 let Canvas3DPickItemInterceptor = class {
     constructor() {
         this.order = 1;

package/es/picker/pick-interceptor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/picker/pick-interceptor.ts"],"names":[],"mappings":"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","file":"pick-interceptor.js","sourcesContent":["import type { IMatrix, IPointLike } from '@visactor/vutils';\nimport { Point, pi2 } from '@visactor/vutils';\nimport { injectable } from '../common/inversify-lite';\nimport { ARC3D_NUMBER_TYPE } from '../graphic/constants';\nimport type {\n  IArc,\n  IContext2d,\n  IGraphic,\n  IGroup,\n  IPickItemInterceptorContribution,\n  IPickParams,\n  IPickerService,\n  PickResult\n} from '../interface';\nimport { matrixAllocate } from '../allocator/matrix-allocate';\n\n// 拦截器\nexport const PickItemInterceptor = Symbol.for('PickItemInterceptor');\n\n/**\n * 影子节点拦截器，用于渲染影子节点\n */\n@injectable()\nexport class ShadowRootPickItemInterceptorContribution implements IPickItemInterceptorContribution {\n  order: number = 1;\n  afterPickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): boolean | PickResult {\n    if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {\n      return this._pickItem(graphic, pickerService, point, pickParams, params);\n    }\n    return false;\n  }\n\n  beforePickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): boolean | PickResult {\n    if (graphic.attribute.shadowRootIdx < 0) {\n      return this._pickItem(graphic, pickerService, point, pickParams, params);\n    }\n    return false;\n  }\n\n  protected _pickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): boolean | PickResult {\n    if (!graphic.shadowRoot) {\n      return false;\n    }\n    const { parentMatrix } = params || {};\n    if (!parentMatrix) {\n      return false;\n    }\n\n    const context = pickerService.pickContext;\n    context.highPerformanceSave();\n\n    const g = graphic.shadowRoot;\n    const currentGroupMatrix = matrixAllocate.allocateByObj(parentMatrix);\n    const newPoint = new Point(point.x, point.y);\n    parentMatrix.transformPoint(newPoint, newPoint);\n    const transMatrix = graphic.transMatrix;\n    currentGroupMatrix.multiply(\n      transMatrix.a,\n      transMatrix.b,\n      transMatrix.c,\n      transMatrix.d,\n      transMatrix.e,\n      transMatrix.f\n    );\n\n    const result = pickerService.pickGroup(g, newPoint.clone(), currentGroupMatrix, pickParams);\n\n    context.highPerformanceRestore();\n\n    return result;\n  }\n}\n\n/**\n * 3d拦截器，用于渲染3d视角\n */\n@injectable()\nexport class Canvas3DPickItemInterceptor implements IPickItemInterceptorContribution {\n  // canvas?: ICanvas;\n  order: number = 1;\n\n  beforePickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) {\n    if (!graphic.in3dMode || pickParams.in3dInterceptor) {\n      return null;\n    }\n\n    const context = pickerService.pickContext;\n    const stage = graphic.stage;\n    if (!(context && stage)) {\n      return null;\n    }\n    pickParams.in3dInterceptor = true;\n\n    // 使用3d模式渲染\n    context.save();\n    this.initCanvasCtx(context);\n    context.camera = stage.camera;\n\n    // 设置context的transform到上一个节点\n    if (graphic.isContainer) {\n      // hack逻辑，如果是饼图的话，需要依次绘制不同的边\n      let isPie: boolean = false;\n      let is3d: boolean = false;\n      graphic.forEachChildren((c: IGraphic) => {\n        isPie = c.numberType === ARC3D_NUMBER_TYPE;\n        return !isPie;\n      });\n      graphic.forEachChildren((c: IGraphic) => {\n        is3d = !!c.findFace;\n        return !is3d;\n      });\n\n      let result: PickResult;\n      if (isPie) {\n        const children = graphic.getChildren() as IArc[];\n        // 绘制内层\n        // drawContext.hack_pieFace = 'inside';\n        // drawContribution.renderGroup(graphic as IGroup, drawContext);\n        // 绘制底部\n        // drawContext.hack_pieFace = 'bottom';\n        // drawContribution.renderGroup(graphic as IGroup, drawContext);\n        // 绘制外部\n        // 排序一下\n        const sortedChildren = [...children];\n        sortedChildren.sort((a, b) => {\n          let angle1 = (a.attribute.startAngle ?? 0 + a.attribute.endAngle ?? 0) / 2;\n          let angle2 = (b.attribute.startAngle ?? 0 + b.attribute.endAngle ?? 0) / 2;\n          while (angle1 < 0) {\n            angle1 += pi2;\n          }\n          while (angle2 < 0) {\n            angle2 += pi2;\n          }\n          return angle2 - angle1;\n        });\n        sortedChildren.forEach(c => {\n          c._next = null;\n          c._prev = null;\n        });\n        graphic.removeAllChild();\n        graphic.update();\n        sortedChildren.forEach(c => {\n          graphic.appendChild(c);\n        });\n        pickParams.hack_pieFace = 'outside';\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        if (!result.graphic) {\n          // 绘制内部\n          pickParams.hack_pieFace = 'inside';\n          result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        }\n        if (!result.graphic) {\n          // 绘制顶部\n          pickParams.hack_pieFace = 'top';\n          result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        }\n        graphic.removeAllChild();\n        children.forEach(c => {\n          c._next = null;\n          c._prev = null;\n        });\n        children.forEach(c => {\n          graphic.appendChild(c);\n        });\n      } else if (is3d) {\n        // 排序这些图元\n        const children = graphic.getChildren() as IGraphic[];\n        const zChildren = children.map(g => {\n          const face3d = g.findFace();\n          const vertices = face3d.vertices;\n          // 计算每个顶点的view\n          const viewdVerticesZ = vertices.map(v => {\n            return context.view(v[0], v[1], v[2] + g.attribute.z ?? 0)[2];\n          });\n          const ave_z = viewdVerticesZ.reduce((a, b) => a + b, 0);\n          return {\n            ave_z,\n            g\n          };\n        });\n        zChildren.sort((a, b) => b.ave_z - a.ave_z);\n        graphic.removeAllChild();\n        zChildren.forEach(i => {\n          i.g._next = null;\n          i.g._prev = null;\n        });\n        graphic.update();\n        zChildren.forEach(i => {\n          graphic.add(i.g);\n        });\n\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n\n        graphic.removeAllChild();\n        children.forEach(g => {\n          g._next = null;\n          g._prev = null;\n        });\n        graphic.update();\n        children.forEach(g => {\n          graphic.add(g);\n        });\n      } else {\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n      }\n\n      context.camera = null;\n\n      pickParams.in3dInterceptor = false;\n      return result;\n    }\n    context.restore();\n    return null;\n  }\n\n  initCanvasCtx(context: IContext2d) {\n    context.setTransformForCurrent();\n  }\n}\n"]}
+{"version":3,"sources":["../src/picker/pick-interceptor.ts"],"names":[],"mappings":"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","file":"pick-interceptor.js","sourcesContent":["import type { IMatrix, IPointLike } from '@visactor/vutils';\nimport { Point, pi2 } from '@visactor/vutils';\nimport { injectable } from '../common/inversify-lite';\nimport { ARC3D_NUMBER_TYPE } from '../graphic/constants';\nimport type {\n  IArc,\n  IContext2d,\n  IGraphic,\n  IGroup,\n  IPickItemInterceptorContribution,\n  IPickParams,\n  IPickerService,\n  PickResult\n} from '../interface';\nimport { matrixAllocate } from '../allocator/matrix-allocate';\n\n// 拦截器\nexport const PickItemInterceptor = Symbol.for('PickItemInterceptor');\n\n/**\n * 影子节点拦截器，用于渲染影子节点\n */\n@injectable()\nexport class ShadowRootPickItemInterceptorContribution implements IPickItemInterceptorContribution {\n  order: number = 1;\n  afterPickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): null | PickResult {\n    if (graphic.attribute.shadowRootIdx > 0 || !graphic.attribute.shadowRootIdx) {\n      return this._pickItem(graphic, pickerService, point, pickParams, params);\n    }\n    return null;\n  }\n\n  beforePickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): null | PickResult {\n    if (graphic.attribute.shadowRootIdx < 0) {\n      return this._pickItem(graphic, pickerService, point, pickParams, params);\n    }\n    return null;\n  }\n\n  protected _pickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): PickResult | null {\n    if (!graphic.shadowRoot) {\n      return null;\n    }\n    const { parentMatrix } = params || {};\n    if (!parentMatrix) {\n      return null;\n    }\n\n    const context = pickerService.pickContext;\n    context.highPerformanceSave();\n\n    const g = graphic.shadowRoot;\n    const currentGroupMatrix = matrixAllocate.allocateByObj(parentMatrix);\n    const newPoint = new Point(point.x, point.y);\n    parentMatrix.transformPoint(newPoint, newPoint);\n    const transMatrix = graphic.transMatrix;\n    currentGroupMatrix.multiply(\n      transMatrix.a,\n      transMatrix.b,\n      transMatrix.c,\n      transMatrix.d,\n      transMatrix.e,\n      transMatrix.f\n    );\n\n    const result = pickerService.pickGroup(g, newPoint.clone(), currentGroupMatrix, pickParams);\n\n    context.highPerformanceRestore();\n\n    return result;\n  }\n}\n\n@injectable()\nexport class InteractivePickItemInterceptorContribution implements IPickItemInterceptorContribution {\n  order: number = 1;\n\n  beforePickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ): null | PickResult {\n    const originGraphic = graphic.baseGraphic;\n    if (originGraphic && originGraphic.parent) {\n      const newPoint = new Point(point.x, point.y);\n      const context = pickerService.pickContext;\n      context.highPerformanceSave();\n      const parentMatrix = originGraphic.parent.globalTransMatrix;\n      parentMatrix.transformPoint(newPoint, newPoint);\n\n      const result = originGraphic.isContainer\n        ? pickerService.pickGroup(originGraphic, newPoint.clone(), parentMatrix, pickParams)\n        : pickerService.pickItem(originGraphic, newPoint.clone(), parentMatrix, pickParams);\n      context.highPerformanceRestore();\n      return result;\n    }\n    return null;\n  }\n}\n\n/**\n * 3d拦截器，用于渲染3d视角\n */\n@injectable()\nexport class Canvas3DPickItemInterceptor implements IPickItemInterceptorContribution {\n  // canvas?: ICanvas;\n  order: number = 1;\n\n  beforePickItem(\n    graphic: IGraphic,\n    pickerService: IPickerService,\n    point: IPointLike,\n    pickParams: IPickParams,\n    params?: {\n      parentMatrix: IMatrix;\n    }\n  ) {\n    if (!graphic.in3dMode || pickParams.in3dInterceptor) {\n      return null;\n    }\n\n    const context = pickerService.pickContext;\n    const stage = graphic.stage;\n    if (!(context && stage)) {\n      return null;\n    }\n    pickParams.in3dInterceptor = true;\n\n    // 使用3d模式渲染\n    context.save();\n    this.initCanvasCtx(context);\n    context.camera = stage.camera;\n\n    // 设置context的transform到上一个节点\n    if (graphic.isContainer) {\n      // hack逻辑，如果是饼图的话，需要依次绘制不同的边\n      let isPie: boolean = false;\n      let is3d: boolean = false;\n      graphic.forEachChildren((c: IGraphic) => {\n        isPie = c.numberType === ARC3D_NUMBER_TYPE;\n        return !isPie;\n      });\n      graphic.forEachChildren((c: IGraphic) => {\n        is3d = !!c.findFace;\n        return !is3d;\n      });\n\n      let result: PickResult;\n      if (isPie) {\n        const children = graphic.getChildren() as IArc[];\n        // 绘制内层\n        // drawContext.hack_pieFace = 'inside';\n        // drawContribution.renderGroup(graphic as IGroup, drawContext);\n        // 绘制底部\n        // drawContext.hack_pieFace = 'bottom';\n        // drawContribution.renderGroup(graphic as IGroup, drawContext);\n        // 绘制外部\n        // 排序一下\n        const sortedChildren = [...children];\n        sortedChildren.sort((a, b) => {\n          let angle1 = (a.attribute.startAngle ?? 0 + a.attribute.endAngle ?? 0) / 2;\n          let angle2 = (b.attribute.startAngle ?? 0 + b.attribute.endAngle ?? 0) / 2;\n          while (angle1 < 0) {\n            angle1 += pi2;\n          }\n          while (angle2 < 0) {\n            angle2 += pi2;\n          }\n          return angle2 - angle1;\n        });\n        sortedChildren.forEach(c => {\n          c._next = null;\n          c._prev = null;\n        });\n        graphic.removeAllChild();\n        graphic.update();\n        sortedChildren.forEach(c => {\n          graphic.appendChild(c);\n        });\n        pickParams.hack_pieFace = 'outside';\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        if (!result.graphic) {\n          // 绘制内部\n          pickParams.hack_pieFace = 'inside';\n          result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        }\n        if (!result.graphic) {\n          // 绘制顶部\n          pickParams.hack_pieFace = 'top';\n          result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n        }\n        graphic.removeAllChild();\n        children.forEach(c => {\n          c._next = null;\n          c._prev = null;\n        });\n        children.forEach(c => {\n          graphic.appendChild(c);\n        });\n      } else if (is3d) {\n        // 排序这些图元\n        const children = graphic.getChildren() as IGraphic[];\n        const zChildren = children.map(g => {\n          const face3d = g.findFace();\n          const vertices = face3d.vertices;\n          // 计算每个顶点的view\n          const viewdVerticesZ = vertices.map(v => {\n            return context.view(v[0], v[1], v[2] + g.attribute.z ?? 0)[2];\n          });\n          const ave_z = viewdVerticesZ.reduce((a, b) => a + b, 0);\n          return {\n            ave_z,\n            g\n          };\n        });\n        zChildren.sort((a, b) => b.ave_z - a.ave_z);\n        graphic.removeAllChild();\n        zChildren.forEach(i => {\n          i.g._next = null;\n          i.g._prev = null;\n        });\n        graphic.update();\n        zChildren.forEach(i => {\n          graphic.add(i.g);\n        });\n\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n\n        graphic.removeAllChild();\n        children.forEach(g => {\n          g._next = null;\n          g._prev = null;\n        });\n        graphic.update();\n        children.forEach(g => {\n          graphic.add(g);\n        });\n      } else {\n        result = pickerService.pickGroup(graphic as IGroup, point, params.parentMatrix, pickParams);\n      }\n\n      context.camera = null;\n\n      pickParams.in3dInterceptor = false;\n      return result;\n    }\n    context.restore();\n    return null;\n  }\n\n  initCanvasCtx(context: IContext2d) {\n    context.setTransformForCurrent();\n  }\n}\n"]}

package/es/picker/pick-modules.js

@@ -4,7 +4,7 @@ import { PickerService, GlobalPickerService } from "./constants";
 
 import { DefaultGlobalPickerService } from "./global-picker-service";
 
-import { Canvas3DPickItemInterceptor, PickItemInterceptor, ShadowRootPickItemInterceptorContribution } from "./pick-interceptor";
+import { Canvas3DPickItemInterceptor, InteractivePickItemInterceptorContribution, PickItemInterceptor, ShadowRootPickItemInterceptorContribution } from "./pick-interceptor";
 
 import { bindContributionProvider } from "../common/contribution-provider";
 
@@ -13,6 +13,7 @@ export default new ContainerModule((bind => {
     bind(GlobalPickerService).toService(DefaultGlobalPickerService), bind(Canvas3DPickItemInterceptor).toSelf().inSingletonScope(), 
     bind(PickItemInterceptor).toService(Canvas3DPickItemInterceptor), bind(ShadowRootPickItemInterceptorContribution).toSelf().inSingletonScope(), 
     bind(PickItemInterceptor).toService(ShadowRootPickItemInterceptorContribution), 
+    bind(InteractivePickItemInterceptorContribution).toSelf().inSingletonScope(), bind(PickItemInterceptor).toService(InteractivePickItemInterceptorContribution), 
     bindContributionProvider(bind, PickItemInterceptor);
 }));
 //# sourceMappingURL=pick-modules.js.map

package/es/picker/pick-modules.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/picker/pick-modules.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACjE,OAAO,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAGrE,OAAO,EACL,2BAA2B,EAC3B,mBAAmB,EACnB,yCAAyC,EAC1C,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAE3E,eAAe,IAAI,eAAe,CAAC,IAAI,CAAC,EAAE;IACxC,IAAI,CAAC,aAAa,CAAC,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC;IAEnD,IAAI,CAAC,0BAA0B,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC7D,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,0BAA0B,CAAC,CAAC;IAGhE,IAAI,CAAC,2BAA2B,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC9D,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;IAEjE,IAAI,CAAC,yCAAyC,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC5E,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,yCAAyC,CAAC,CAAC;IAC/E,wBAAwB,CAAC,IAAI,EAAE,mBAAmB,CAAC,CAAC;AACtD,CAAC,CAAC,CAAC","file":"pick-modules.js","sourcesContent":["import { ContainerModule } from '../common/inversify-lite';\nimport { PickerService, GlobalPickerService } from './constants';\nimport { DefaultGlobalPickerService } from './global-picker-service';\n// import { DefaultCanvasPickerService } from './canvas-picker-service';\n// import { DefaultMathPickerService } from './math-picker-service';\nimport {\n  Canvas3DPickItemInterceptor,\n  PickItemInterceptor,\n  ShadowRootPickItemInterceptorContribution\n} from './pick-interceptor';\nimport { bindContributionProvider } from '../common/contribution-provider';\n\nexport default new ContainerModule(bind => {\n  bind(PickerService).toService(GlobalPickerService);\n\n  bind(DefaultGlobalPickerService).toSelf().inSingletonScope();\n  bind(GlobalPickerService).toService(DefaultGlobalPickerService);\n\n  // interceptor\n  bind(Canvas3DPickItemInterceptor).toSelf().inSingletonScope();\n  bind(PickItemInterceptor).toService(Canvas3DPickItemInterceptor);\n\n  bind(ShadowRootPickItemInterceptorContribution).toSelf().inSingletonScope();\n  bind(PickItemInterceptor).toService(ShadowRootPickItemInterceptorContribution);\n  bindContributionProvider(bind, PickItemInterceptor);\n});\n"]}
+{"version":3,"sources":["../src/picker/pick-modules.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACjE,OAAO,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAGrE,OAAO,EACL,2BAA2B,EAC3B,0CAA0C,EAC1C,mBAAmB,EACnB,yCAAyC,EAC1C,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAE3E,eAAe,IAAI,eAAe,CAAC,IAAI,CAAC,EAAE;IACxC,IAAI,CAAC,aAAa,CAAC,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC;IAEnD,IAAI,CAAC,0BAA0B,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC7D,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,0BAA0B,CAAC,CAAC;IAGhE,IAAI,CAAC,2BAA2B,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC9D,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,2BAA2B,CAAC,CAAC;IAGjE,IAAI,CAAC,yCAAyC,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC5E,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,yCAAyC,CAAC,CAAC;IAG/E,IAAI,CAAC,0CAA0C,CAAC,CAAC,MAAM,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC7E,IAAI,CAAC,mBAAmB,CAAC,CAAC,SAAS,CAAC,0CAA0C,CAAC,CAAC;IAChF,wBAAwB,CAAC,IAAI,EAAE,mBAAmB,CAAC,CAAC;AACtD,CAAC,CAAC,CAAC","file":"pick-modules.js","sourcesContent":["import { ContainerModule } from '../common/inversify-lite';\nimport { PickerService, GlobalPickerService } from './constants';\nimport { DefaultGlobalPickerService } from './global-picker-service';\n// import { DefaultCanvasPickerService } from './canvas-picker-service';\n// import { DefaultMathPickerService } from './math-picker-service';\nimport {\n  Canvas3DPickItemInterceptor,\n  InteractivePickItemInterceptorContribution,\n  PickItemInterceptor,\n  ShadowRootPickItemInterceptorContribution\n} from './pick-interceptor';\nimport { bindContributionProvider } from '../common/contribution-provider';\n\nexport default new ContainerModule(bind => {\n  bind(PickerService).toService(GlobalPickerService);\n\n  bind(DefaultGlobalPickerService).toSelf().inSingletonScope();\n  bind(GlobalPickerService).toService(DefaultGlobalPickerService);\n\n  // interceptor\n  bind(Canvas3DPickItemInterceptor).toSelf().inSingletonScope();\n  bind(PickItemInterceptor).toService(Canvas3DPickItemInterceptor);\n\n  // shadow root\n  bind(ShadowRootPickItemInterceptorContribution).toSelf().inSingletonScope();\n  bind(PickItemInterceptor).toService(ShadowRootPickItemInterceptorContribution);\n\n  // interactive\n  bind(InteractivePickItemInterceptorContribution).toSelf().inSingletonScope();\n  bind(PickItemInterceptor).toService(InteractivePickItemInterceptorContribution);\n  bindContributionProvider(bind, PickItemInterceptor);\n});\n"]}

package/es/picker/picker-service.d.ts

@@ -13,6 +13,6 @@ export declare abstract class DefaultPickService implements IPickerService {
     pick(graphics: IGraphic[], point: IPoint, params: IPickParams): PickResult;
     containsPoint(graphic: IGraphic, point: IPointLike, params: IPickParams): boolean;
     pickGroup(group: IGroup, point: IPointLike, parentMatrix: IMatrix, params: IPickParams): PickResult;
-    abstract pickItem(graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params: IPickParams): IGraphic | null;
+    abstract pickItem(graphic: IGraphic, point: IPointLike, parentMatrix: IMatrix | null, params: IPickParams): PickResult | null;
     protected selectPicker(graphic: IGraphic): IGraphicPicker | null;
 }