@visactor/vchart 1.13.9-alpha.6 → 1.13.9

package/cjs/component/axis/interface/spec.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/component/axis/interface/spec.ts"],"names":[],"mappings":"","file":"spec.js","sourcesContent":["import type { AxisBreakProps, AxisItem, AxisItemStateStyle } from '@visactor/vrender-components';\nimport type { IAnimationSpec } from '../../../animation/spec';\nimport type {\n  Datum,\n  IFormatMethod,\n  IPadding,\n  IRectMarkSpec,\n  IRichTextFormatMethod,\n  IRuleMarkSpec,\n  ISymbolMarkSpec,\n  ITextMarkSpec,\n  StringOrNumber\n} from '../../../typings';\nimport type { IComponentSpec } from '../../base/interface';\nimport type { AxisType, IAxisItem, IBandAxisLayer, ITickCalculationCfg, StyleCallback } from './common';\nimport type { IBaseScale } from '@visactor/vscale';\n\nexport interface ICommonAxisSpec extends Omit<IComponentSpec, 'orient' | 'center'>, IAnimationSpec<string, string> {\n  /**\n   * 轴类型\n   */\n  type?: AxisType;\n  /**\n   * 是否显示坐标轴\n   * @default true\n   */\n  visible?: boolean;\n  /**\n   * 是否开启反向坐标轴。\n   * @default false\n   */\n  inverse?: boolean;\n  /**\n   * 轴刻度线配置\n   */\n  tick?: ITick;\n  /**\n   * 子刻度线配置\n   */\n  subTick?: ISubTick;\n\n  /**\n   * 是否开启动画，默认关闭\n   * @default false\n   */\n  animation?: boolean;\n\n  // 交互相关的配置\n  /**\n   * 是否开启 select 选中交互，默认关闭\n   * @default false\n   */\n  select?: boolean;\n  /**\n   * 是否开启 hover 悬浮交互，默认关闭\n   * @default false\n   */\n  hover?: boolean;\n\n  /**\n   * 是否开启轴数据采样，默认开启。\n   * 轴采样开启之后，会对轴数据进行采样显示，防止轴数据的重叠。\n   * 通过配置 `label.minGap` 可以控制轴标签之间的间距。\n   * @default true\n   * @since 1.1.0\n   */\n  sampling?: boolean;\n\n  /**\n   * 是否强制初始化 tick 数据，仅在 visible 为 false 时生效\n   * @default false\n   */\n  forceInitTick?: boolean;\n}\n\nexport type ILinearAxisBreakSpec = Omit<AxisBreakProps, 'rawRange'> & {\n  /**\n   * 截断标识之间的间距：\n   * 1. `number` 为像素值\n   * 2. `string` 为百分比相对值，如 '1%'\n   * @default 6\n   */\n  gap?: number | string;\n  /**\n   * 计算截断对应range的类型，根据长度或者记录数进行分段\n   * @since 1.12.12\n   */\n  scopeType?: 'count' | 'length';\n};\n\nexport interface ILinearAxisSpec {\n  // 线性轴数值范围配置\n  /** 最小值，**优先级高于 zero，nice** */\n  min?: number;\n  /** 最大值，**优先级高于 zero，nice** */\n  max?: number;\n\n  /**\n   * 最小值，当且仅当该值小于数据最小值时，才能生效\n   * 注意：不建议和配置`min`一起使用\n   * @since 1.11.0\n   */\n  softMin?: number | ((domain: number[]) => number);\n  /**\n   * 最大值，当且仅当该值大于数据最大值时，才能生效\n   * 注意：不建议和配置`max`一起使用\n   * @since 1.11.0\n   */\n  softMax?: number | ((domain: number[]) => number);\n\n  /** @deparated 线性轴数值范围配置（已弃用，请使用外层 min/max） */\n  range?: {\n    /** @deparated 最小值 */\n    min?: number;\n    /** @deparated 最大值 */\n    max?: number;\n  };\n\n  /**\n   * 是否根据数据将轴范围调整到相对规整的数值\n   * @default true\n   * @description 当配置了 min 和 max，该配置项失效\n   * @example 当配置了 max = 999, nice并不会将轴范围优化到1000\n   */\n  nice?: boolean;\n  /**\n   * nice效果的类型，是精度优先还是tickCount优先（比如tickCount为2那nice出来的精度就很低）\n   * @default undefined('tickCountFirst')\n   * @description 不配置就默认是tickCountFirst\n   * @example 数据范围是0~6000，如果tickCount为2，那么tickCountFirst出来的range就是[0, 10000], accurateFirst出来的range就是[0, 6000]但10000显示不了\n   */\n  niceType?: 'tickCountFirst' | 'accurateFirst';\n  /**\n   * 是否包含0值\n   * @default true\n   * @description 当配置了 min和 max，该配置项失效\n   */\n  zero?: boolean;\n  /**\n   * 轴范围按比例扩展\n   * @description 当配置了 min和 max，该配置项失效\n   */\n  expand?: {\n    /**\n     * 轴范围扩展的最小比例\n     */\n    min?: number;\n    /**\n     * 轴范围扩展的最大比例\n     */\n    max?: number;\n  };\n\n  /**\n   * 连续轴上的 dimension tooltip 数据筛选范围\n   * 如果配置为单个数字 d，则筛选区间为 [x0 - d, x0 + d]；如果配置为二元组 [d1, d2]，则筛选区间为 [x0 + d1, x0 + d2]\n   * 如果配置为函数 f, 函数的返回值将会作为数据筛选范围的值\n   * @since 1.4.0\n   */\n  tooltipFilterRange?: number | [number, number] | ((params: { scale: IBaseScale }) => number | [number, number]);\n  /**\n   * 轴截断配置，只对笛卡尔坐标系的 linear 轴生效\n   * @since 1.12.4\n   */\n  breaks?: ILinearAxisBreakSpec[];\n}\n\nexport interface IBandAxisSpec {\n  /**\n   * 是否去除 band 轴两端的留白，如果为 true，则两端的 padding 为 0，\n   * **并且 bandPadding、paddingInner 和 paddingOuter 的设置将被忽略**。\n   * @default false\n   * @since 1.7.0\n   */\n  trimPadding?: boolean;\n  /**\n   * 同时设置轴的 paddingInner 和 paddingOuter\n   * **因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 bandPadding 配置**\n   */\n  bandPadding?: number | number[];\n  /**\n   * band 轴的内边距\n   * ** 因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 paddingInner 配置**\n   * @default 0.1\n   */\n  paddingInner?: number | number[];\n  /**\n   * band 轴的外边距\n   * ** 因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 paddingOuter 配置**\n   * @default 0.3\n   */\n  paddingOuter?: number | number[];\n  /**\n   * 配置离散轴的数值范围\n   * @since 1.1.0\n   */\n  domain?: StringOrNumber[];\n  /**\n   * `bandPosition` 是一个可选参数，用于指定数据点在 band 轴上的位置。它的含义是确定数据点在 band 轴上的位置偏移量，相对于 band 轴的起始位置。\n   * `bandPosition` 的取值范围是从 0 到 1，其中 0 表示数据点位于 band 轴的起始位置，1 表示数据点位于 band 轴的结束位置。\n   * @default 0.5\n   */\n  bandPosition?: number;\n\n  /**\n   * 当存在多层分组场景时，是否展示所有的分组轴\n   * @default false\n   * @since 1.9.0\n   */\n  showAllGroupLayers?: boolean;\n  /**\n   * 每一层轴的配置\n   * layer[0] 为离坐标轴线最近的轴，当且仅当 `showAllGroupLayers` 配置开启生效。\n   * @since 1.9.0\n   */\n  layers?: IBandAxisLayer[];\n}\n// Grid 配置项\nexport interface IGrid extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * 两个栅格线间的填充色\n   */\n  alternateColor?: string | string[];\n  /**\n   * grid 是否与 label 对齐，默认为 true，即对齐，配置为 false 则显示在前后两个刻度中间\n   * @default true\n   */\n  alignWithLabel?: boolean;\n  /**\n   * 网格线样式，支持回调\n   */\n  style?: IRuleMarkSpec | StyleCallback<IRuleMarkSpec | undefined>;\n  /**\n   * 快捷属性，也可以在 `style` 中配置，用于配置网格线的绘制顺序，默认为 50\n   * @default 50\n   * @since 1.4.0\n   */\n  zIndex?: number;\n}\n\n// 刻度线配置\nexport interface ITick extends IAxisItem<IRuleMarkSpec>, ITickCalculationCfg {\n  /**\n   * Length of tick lines\n   * 坐标轴刻度线的长度\n   * @default 4\n   */\n  tickSize?: number;\n  /**\n   * 刻度线朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /**\n   * tick 是否与 label 对齐，默认为 true，即对齐，配置为 false 则显示在前后两个刻度中间\n   * @default true\n   */\n  alignWithLabel?: boolean;\n  /**\n   * 刻度线样式设置，支持回调\n   */\n  style?: IRuleMarkSpec | StyleCallback<IRuleMarkSpec | undefined>;\n  /**\n   * 刻度线不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n  /**\n   * 用于 tick 的数据过滤\n   * @since 1.1.0\n   */\n  dataFilter?: (data: AxisItem[]) => AxisItem[];\n}\n\n// 子刻度线配置\nexport interface ISubTick extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * TODO: 考虑下 log 轴，自刻度线之间的间距是不均匀的问题\n   * 子刻度个数\n   */\n  tickCount?: number;\n  /**\n   * 子刻度线朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /** 子刻度线的长度 */\n  tickSize?: number;\n  /**\n   * 子刻度线不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n}\n\n// 轴标签配置\nexport interface ILabel extends IAxisItem<ITextMarkSpec> {\n  /**\n   * 文本类型\n   * @deprecated 1.10.0 版本后，在 formatMethod 中返回 { type: 'rich', text: xxx}\n   * */\n  type?: 'text' | 'rich';\n  /**\n   * 轴标签内容格式化函数\n   * @param text 原始标签文本值\n   * @param datum 图形数据\n   * @returns 格式化后的文本\n   */\n  formatMethod?: IFormatMethod<[text: string | string[], datum?: Datum]>;\n  /**\n   * 格式化模板\n   * @description 可以通过类似 `{value:.2f}%` 的形式对指定数据字段进行格式化\n   * @since 1.10.0\n   */\n  formatter?: string | string[];\n  /** 标签同 tick 之间的间距 */\n  space?: number;\n  /**\n   * 标签朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /**\n   * 标签之间的最小间距（单位为像素），仅当轴采样开始时生效（`sampling: true`）。\n   * 该配置会影响轴采样的结果。\n   */\n  minGap?: number;\n  /**\n   * 文本样式设置\n   */\n  style?: ITextMarkSpec | StyleCallback<ITextMarkSpec | undefined>;\n  /**\n   * label 不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<ITextMarkSpec>;\n  /**\n   * 用于 label 的数据过滤\n   * @since 1.1.0\n   */\n  dataFilter?: (data: AxisItem[], layer: number) => AxisItem[];\n}\n\n// 轴线配置\nexport interface IDomainLine extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * domainLine 在不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n}\n\n// 轴标题配置\nexport interface ITitle extends IAxisItem<ITextMarkSpec> {\n  /**\n   * 文本类型\n   * @deprecated 1.10.0 版本后，在 formatMethod 中返回 { type: 'rich', text: xxx}\n   * */\n  type?: 'text' | 'rich';\n  /**\n   * 轴标题内容，支持多种格式\n   * - 字符串或者数值\n   * - 字符串或者数值数组\n   */\n  text?: ITextMarkSpec['text'] | ReturnType<IRichTextFormatMethod<[]>>;\n  /**\n   * 标题的显示位置，直角坐标系默认 'middle'；\n   * 极坐标系的圆弧轴如果配置了内半径，则默认 'middle'，否则 'end'\n   */\n  position?: 'start' | 'middle' | 'end';\n  /**\n   * 标题距离坐标轴(轴线、刻度、标签共同构成的包围盒)的距离\n   */\n  space?: number;\n  /**\n   * 标题内边距配置\n   */\n  padding?: IPadding | number | number[];\n  /**\n   * 标题背景色设置\n   */\n  background?: IAxisItem<IRectMarkSpec> & {\n    /**\n     * 背景的交互状态样式配置\n     */\n    state?: AxisItemStateStyle<Partial<IRectMarkSpec>>;\n  };\n  /**\n   * TODO: 接入富文本\n   * 标题 shape 配置\n   */\n  shape?: IAxisItem<ISymbolMarkSpec> & {\n    /**\n     * shape 同标题文本之间的间距\n     */\n    space?: number;\n    /**\n     * shape 标记的交互状态样式配置\n     */\n    state?: AxisItemStateStyle<Partial<ISymbolMarkSpec>>;\n  };\n  /**\n   * 标题整体的旋转角度（如果标题配置了 background、shape 等属性的话，需要使用该属性进行整体的配置旋转）。\n   */\n  angle?: number;\n  /**\n   * text 文本的交互状态样式配置\n   */\n  state?: AxisItemStateStyle<Partial<ITextMarkSpec>>;\n}\n"]}
+{"version":3,"sources":["../src/component/axis/interface/spec.ts"],"names":[],"mappings":"","file":"spec.js","sourcesContent":["import type { AxisBreakProps, AxisItem, AxisItemStateStyle } from '@visactor/vrender-components';\nimport type { IAnimationSpec } from '../../../animation/spec';\nimport type {\n  Datum,\n  IFormatMethod,\n  IPadding,\n  IRectMarkSpec,\n  IRichTextFormatMethod,\n  IRuleMarkSpec,\n  ISymbolMarkSpec,\n  ITextMarkSpec,\n  StringOrNumber\n} from '../../../typings';\nimport type { IComponentSpec } from '../../base/interface';\nimport type { AxisType, IAxisItem, IBandAxisLayer, ITickCalculationCfg, StyleCallback } from './common';\nimport type { IBaseScale } from '@visactor/vscale';\nimport type { IVChart } from '../../../core';\n\nexport interface ICommonAxisSpec extends Omit<IComponentSpec, 'orient' | 'center'>, IAnimationSpec<string, string> {\n  /**\n   * 轴类型\n   */\n  type?: AxisType;\n  /**\n   * 是否显示坐标轴\n   * @default true\n   */\n  visible?: boolean;\n  /**\n   * 是否开启反向坐标轴。\n   * @default false\n   */\n  inverse?: boolean;\n  /**\n   * 轴刻度线配置\n   */\n  tick?: ITick;\n  /**\n   * 子刻度线配置\n   */\n  subTick?: ISubTick;\n\n  /**\n   * 是否开启动画，默认关闭\n   * @default false\n   */\n  animation?: boolean;\n\n  // 交互相关的配置\n  /**\n   * 是否开启 select 选中交互，默认关闭\n   * @default false\n   */\n  select?: boolean;\n  /**\n   * 是否开启 hover 悬浮交互，默认关闭\n   * @default false\n   */\n  hover?: boolean;\n\n  /**\n   * 是否开启轴数据采样，默认开启。\n   * 轴采样开启之后，会对轴数据进行采样显示，防止轴数据的重叠。\n   * 通过配置 `label.minGap` 可以控制轴标签之间的间距。\n   * @default true\n   * @since 1.1.0\n   */\n  sampling?: boolean;\n\n  /**\n   * 是否强制初始化 tick 数据，仅在 visible 为 false 时生效\n   * @default false\n   */\n  forceInitTick?: boolean;\n}\n\nexport type ILinearAxisBreakSpec = Omit<AxisBreakProps, 'rawRange'> & {\n  /**\n   * 截断标识之间的间距：\n   * 1. `number` 为像素值\n   * 2. `string` 为百分比相对值，如 '1%'\n   * @default 6\n   */\n  gap?: number | string;\n  /**\n   * 计算截断对应range的类型，根据长度或者记录数进行分段\n   * @since 1.12.12\n   */\n  scopeType?: 'count' | 'length';\n};\n\nexport interface ILinearAxisSpec {\n  // 线性轴数值范围配置\n  /** 最小值，**优先级高于 zero，nice** */\n  min?: number;\n  /** 最大值，**优先级高于 zero，nice** */\n  max?: number;\n\n  /**\n   * 最小值，当且仅当该值小于数据最小值时，才能生效\n   * 注意：不建议和配置`min`一起使用\n   * @since 1.11.0\n   */\n  softMin?: number | ((domain: number[]) => number);\n  /**\n   * 最大值，当且仅当该值大于数据最大值时，才能生效\n   * 注意：不建议和配置`max`一起使用\n   * @since 1.11.0\n   */\n  softMax?: number | ((domain: number[]) => number);\n\n  /** @deparated 线性轴数值范围配置（已弃用，请使用外层 min/max） */\n  range?: {\n    /** @deparated 最小值 */\n    min?: number;\n    /** @deparated 最大值 */\n    max?: number;\n  };\n\n  /**\n   * 是否根据数据将轴范围调整到相对规整的数值\n   * @default true\n   * @description 当配置了 min 和 max，该配置项失效\n   * @example 当配置了 max = 999, nice并不会将轴范围优化到1000\n   */\n  nice?: boolean;\n  /**\n   * nice效果的类型，是精度优先还是tickCount优先（比如tickCount为2那nice出来的精度就很低）\n   * @default undefined('tickCountFirst')\n   * @description 不配置就默认是tickCountFirst\n   * @example 数据范围是0~6000，如果tickCount为2，那么tickCountFirst出来的range就是[0, 10000], accurateFirst出来的range就是[0, 6000]但10000显示不了\n   */\n  niceType?: 'tickCountFirst' | 'accurateFirst';\n  /**\n   * 是否包含0值\n   * @default true\n   * @description 当配置了 min和 max，该配置项失效\n   */\n  zero?: boolean;\n  /**\n   * 轴范围按比例扩展\n   * @description 当配置了 min和 max，该配置项失效\n   */\n  expand?: {\n    /**\n     * 轴范围扩展的最小比例\n     */\n    min?: number;\n    /**\n     * 轴范围扩展的最大比例\n     */\n    max?: number;\n  };\n\n  /**\n   * 连续轴上的 dimension tooltip 数据筛选范围\n   * 如果配置为单个数字 d，则筛选区间为 [x0 - d, x0 + d]；如果配置为二元组 [d1, d2]，则筛选区间为 [x0 + d1, x0 + d2]\n   * 如果配置为函数 f, 函数的返回值将会作为数据筛选范围的值\n   * @since 1.4.0\n   */\n  tooltipFilterRange?: number | [number, number] | ((params: { scale: IBaseScale }) => number | [number, number]);\n  /**\n   * 轴截断配置，只对笛卡尔坐标系的 linear 轴生效\n   * @since 1.12.4\n   */\n  breaks?: ILinearAxisBreakSpec[];\n}\n\nexport interface IBandAxisSpec {\n  /**\n   * 是否去除 band 轴两端的留白，如果为 true，则两端的 padding 为 0，\n   * **并且 bandPadding、paddingInner 和 paddingOuter 的设置将被忽略**。\n   * @default false\n   * @since 1.7.0\n   */\n  trimPadding?: boolean;\n  /**\n   * 同时设置轴的 paddingInner 和 paddingOuter\n   * **因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 bandPadding 配置**\n   */\n  bandPadding?: number | number[];\n  /**\n   * band 轴的内边距\n   * ** 因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 paddingInner 配置**\n   * @default 0.1\n   */\n  paddingInner?: number | number[];\n  /**\n   * band 轴的外边距\n   * ** 因为有可能存在多层 scale( xField 设置成了数组，即分组场景），所以支持了数组类型，用于多层 scale 的 paddingOuter 配置**\n   * @default 0.3\n   */\n  paddingOuter?: number | number[];\n  /**\n   * 配置离散轴的数值范围\n   * @since 1.1.0\n   */\n  domain?: StringOrNumber[];\n  /**\n   * `bandPosition` 是一个可选参数，用于指定数据点在 band 轴上的位置。它的含义是确定数据点在 band 轴上的位置偏移量，相对于 band 轴的起始位置。\n   * `bandPosition` 的取值范围是从 0 到 1，其中 0 表示数据点位于 band 轴的起始位置，1 表示数据点位于 band 轴的结束位置。\n   * @default 0.5\n   */\n  bandPosition?: number;\n\n  /**\n   * 当存在多层分组场景时，是否展示所有的分组轴\n   * @default false\n   * @since 1.9.0\n   */\n  showAllGroupLayers?: boolean;\n  /**\n   * 每一层轴的配置\n   * layer[0] 为离坐标轴线最近的轴，当且仅当 `showAllGroupLayers` 配置开启生效。\n   * @since 1.9.0\n   */\n  layers?: IBandAxisLayer[];\n}\n// Grid 配置项\nexport interface IGrid extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * 两个栅格线间的填充色\n   */\n  alternateColor?: string | string[];\n  /**\n   * grid 是否与 label 对齐，默认为 true，即对齐，配置为 false 则显示在前后两个刻度中间\n   * @default true\n   */\n  alignWithLabel?: boolean;\n  /**\n   * 网格线样式，支持回调\n   */\n  style?: IRuleMarkSpec | StyleCallback<IRuleMarkSpec | undefined>;\n  /**\n   * 快捷属性，也可以在 `style` 中配置，用于配置网格线的绘制顺序，默认为 50\n   * @default 50\n   * @since 1.4.0\n   */\n  zIndex?: number;\n}\n\n// 刻度线配置\nexport interface ITick extends IAxisItem<IRuleMarkSpec>, ITickCalculationCfg {\n  /**\n   * Length of tick lines\n   * 坐标轴刻度线的长度\n   * @default 4\n   */\n  tickSize?: number;\n  /**\n   * 刻度线朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /**\n   * tick 是否与 label 对齐，默认为 true，即对齐，配置为 false 则显示在前后两个刻度中间\n   * @default true\n   */\n  alignWithLabel?: boolean;\n  /**\n   * 刻度线样式设置，支持回调\n   */\n  style?: IRuleMarkSpec | StyleCallback<IRuleMarkSpec | undefined>;\n  /**\n   * 刻度线不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n  /**\n   * 用于 tick 的数据过滤\n   * @since 1.1.0\n   */\n  dataFilter?: (data: AxisItem[], context: { vchart: IVChart }) => AxisItem[];\n}\n\n// 子刻度线配置\nexport interface ISubTick extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * TODO: 考虑下 log 轴，自刻度线之间的间距是不均匀的问题\n   * 子刻度个数\n   */\n  tickCount?: number;\n  /**\n   * 子刻度线朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /** 子刻度线的长度 */\n  tickSize?: number;\n  /**\n   * 子刻度线不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n}\n\n// 轴标签配置\nexport interface ILabel extends IAxisItem<ITextMarkSpec> {\n  /**\n   * 文本类型\n   * @deprecated 1.10.0 版本后，在 formatMethod 中返回 { type: 'rich', text: xxx}\n   * */\n  type?: 'text' | 'rich';\n  /**\n   * 轴标签内容格式化函数\n   * @param text 原始标签文本值\n   * @param datum 图形数据\n   * @returns 格式化后的文本\n   */\n  formatMethod?: IFormatMethod<[text: string | string[], datum?: Datum]>;\n  /**\n   * 格式化模板\n   * @description 可以通过类似 `{value:.2f}%` 的形式对指定数据字段进行格式化\n   * @since 1.10.0\n   */\n  formatter?: string | string[];\n  /** 标签同 tick 之间的间距 */\n  space?: number;\n  /**\n   * 标签朝向，默认朝外(坐标线包围盒外部)\n   * @default false\n   */\n  inside?: boolean;\n  /**\n   * 标签之间的最小间距（单位为像素），仅当轴采样开始时生效（`sampling: true`）。\n   * 该配置会影响轴采样的结果。\n   */\n  minGap?: number;\n  /**\n   * 文本样式设置\n   */\n  style?: ITextMarkSpec | StyleCallback<ITextMarkSpec | undefined>;\n  /**\n   * label 不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<ITextMarkSpec>;\n  /**\n   * 用于 label 的数据过滤\n   * @since 1.1.0\n   */\n  dataFilter?: (data: AxisItem[], layer: number, context: { vchart: IVChart }) => AxisItem[];\n}\n\n// 轴线配置\nexport interface IDomainLine extends IAxisItem<IRuleMarkSpec> {\n  /**\n   * domainLine 在不同交互状态下的样式配置，支持：\n   * 1. hover\n   * 2. hover_reverse\n   * 3. selected\n   * 4. selected_reverse\n   */\n  state?: AxisItemStateStyle<IRuleMarkSpec>;\n}\n\n// 轴标题配置\nexport interface ITitle extends IAxisItem<ITextMarkSpec> {\n  /**\n   * 文本类型\n   * @deprecated 1.10.0 版本后，在 formatMethod 中返回 { type: 'rich', text: xxx}\n   * */\n  type?: 'text' | 'rich';\n  /**\n   * 轴标题内容，支持多种格式\n   * - 字符串或者数值\n   * - 字符串或者数值数组\n   */\n  text?: ITextMarkSpec['text'] | ReturnType<IRichTextFormatMethod<[]>>;\n  /**\n   * 标题的显示位置，直角坐标系默认 'middle'；\n   * 极坐标系的圆弧轴如果配置了内半径，则默认 'middle'，否则 'end'\n   */\n  position?: 'start' | 'middle' | 'end';\n  /**\n   * 标题距离坐标轴(轴线、刻度、标签共同构成的包围盒)的距离\n   */\n  space?: number;\n  /**\n   * 标题内边距配置\n   */\n  padding?: IPadding | number | number[];\n  /**\n   * 标题背景色设置\n   */\n  background?: IAxisItem<IRectMarkSpec> & {\n    /**\n     * 背景的交互状态样式配置\n     */\n    state?: AxisItemStateStyle<Partial<IRectMarkSpec>>;\n  };\n  /**\n   * TODO: 接入富文本\n   * 标题 shape 配置\n   */\n  shape?: IAxisItem<ISymbolMarkSpec> & {\n    /**\n     * shape 同标题文本之间的间距\n     */\n    space?: number;\n    /**\n     * shape 标记的交互状态样式配置\n     */\n    state?: AxisItemStateStyle<Partial<ISymbolMarkSpec>>;\n  };\n  /**\n   * 标题整体的旋转角度（如果标题配置了 background、shape 等属性的话，需要使用该属性进行整体的配置旋转）。\n   */\n  angle?: number;\n  /**\n   * text 文本的交互状态样式配置\n   */\n  state?: AxisItemStateStyle<Partial<ITextMarkSpec>>;\n}\n"]}

package/cjs/component/brush/brush.d.ts

@@ -37,45 +37,23 @@ export declare class Brush<T extends IBrushSpec = IBrushSpec> extends BaseCompon
     protected _linkedOutOfBrushElementsMap: {
         [elementKey: string]: IElement;
     };
-    private _needInitOutState;
     private _cacheInteractiveRangeAttrs;
     private _needDisablePickable;
     private _releatedAxes;
     private _regionAxisMap;
     private _axisDataZoomMap;
     private _zoomRecord;
-    init(): void;
     static getSpecInfo(chartSpec: any): Maybe<IModelSpecInfo[]>;
+    init(): void;
+    private _initNeedOperatedItem;
     created(): void;
-    protected _extendDataInBrush(elementsMap: {
-        [brushName: string]: {
-            [elementKey: string]: IElement;
-        };
-    }): any[];
-    protected _extendDatumOutOfBrush(elementsMap: {
-        [elementKey: string]: IElement;
-    }): any[];
-    protected _getBrushInteractiveAttr(region: IRegion): BrushInteractiveRangeAttr;
-    protected _updateBrushComponent(region: IRegion, componentIndex: number): void;
-    protected _createBrushComponent(region: IRegion, componentIndex: number): void;
-    private _handleBrushChange;
-    private _emitEvent;
-    private _transformBrushedMarkAttr;
-    private _reconfigItem;
-    private _reconfigLinkedItem;
-    private _isBrushContainItem;
-    private _stateClamp;
-    private _setAxisAndDataZoom;
     protected _bindRegions(): void;
     protected _bindLinkedSeries(): void;
     private _initRegionAxisMap;
     private _initAxisDataZoomMap;
-    private _initNeedOperatedItem;
-    protected _initMarkBrushState(componentIndex: number, stateName: string): void;
     protected initEvent(): void;
     onRender(ctx: IModelRenderOption): void;
     changeRegions(regions: IRegion[]): void;
-    protected _getNeedClearVRenderComponents(): IGraphic[];
     _compareSpec(spec: T, prevSpec: T): {
         change: boolean;
         reMake: boolean;
@@ -84,6 +62,27 @@ export declare class Brush<T extends IBrushSpec = IBrushSpec> extends BaseCompon
         reCompile: boolean;
     };
     onLayoutEnd(ctx: any): void;
+    protected _updateBrushComponent(region: IRegion, componentIndex: number): void;
+    protected _createBrushComponent(region: IRegion, componentIndex: number): void;
+    protected _getBrushInteractiveAttr(region: IRegion): BrushInteractiveRangeAttr;
+    private _transformBrushedMarkAttr;
+    private _handleBrushChange;
+    protected _extendDataInBrush(elementsMap: {
+        [brushName: string]: {
+            [elementKey: string]: IElement;
+        };
+    }): any[];
+    protected _extendDatumOutOfBrush(elementsMap: {
+        [elementKey: string]: IElement;
+    }): any[];
+    private _emitEvent;
+    private _reconfigItem;
+    private _reconfigLinkedItem;
+    private _isBrushContainItem;
+    protected _initMarkBrushState(componentIndex: number, stateName: string): void;
+    private _stateClamp;
+    private _setAxisAndDataZoom;
+    protected _getNeedClearVRenderComponents(): IGraphic[];
     clearGraphic(): void;
     clear(): void;
 }

package/cjs/component/brush/brush.js

@@ -12,8 +12,11 @@ class Brush extends base_component_1.BaseComponent {
         this.name = type_1.ComponentTypeEnum.brush, this.specKey = "brush", this.layoutZIndex = layout_1.LayoutZIndex.Brush, 
         this._linkedSeries = [], this._itemMap = {}, this._linkedItemMap = {}, this._inBrushElementsMap = {}, 
         this._outOfBrushElementsMap = {}, this._linkedInBrushElementsMap = {}, this._linkedOutOfBrushElementsMap = {}, 
-        this._needInitOutState = !0, this._cacheInteractiveRangeAttrs = [], this._needDisablePickable = !1, 
-        this._releatedAxes = [], this._regionAxisMap = {}, this._axisDataZoomMap = {}, this._zoomRecord = [];
+        this._cacheInteractiveRangeAttrs = [], this._needDisablePickable = !1, this._releatedAxes = [], 
+        this._regionAxisMap = {}, this._axisDataZoomMap = {}, this._zoomRecord = [];
+    }
+    static getSpecInfo(chartSpec) {
+        return (0, util_1.getSpecInfo)(chartSpec, this.specKey, this.type, (s => !1 !== s.visible));
     }
     init() {
         const inBrushMarkAttr = this._transformBrushedMarkAttr(this._spec.inBrush), outOfBrushMarkAttr = this._transformBrushedMarkAttr(this._spec.outOfBrush);
@@ -24,42 +27,71 @@ class Brush extends base_component_1.BaseComponent {
             }));
         }));
     }
-    static getSpecInfo(chartSpec) {
-        return (0, util_1.getSpecInfo)(chartSpec, this.specKey, this.type, (s => !1 !== s.visible));
+    _initNeedOperatedItem() {
+        const seriesUserId = this._spec.seriesId, seriesIndex = this._spec.seriesIndex;
+        this._relativeRegions.forEach((r => {
+            const allMarks = [];
+            r.getSeries().forEach((s => {
+                (seriesUserId && (0, vutils_1.array)(seriesUserId).includes(s.userId.toString()) || seriesIndex && (0, 
+                vutils_1.array)(seriesIndex).includes(s.getSpecIndex()) || !seriesIndex && !seriesUserId) && allMarks.push(...s.getMarksWithoutRoot()), 
+                this._itemMap[r.id] = allMarks;
+            }));
+        })), this._linkedSeries.forEach((s => {
+            this._linkedItemMap[s.id] = s.getMarksWithoutRoot();
+        }));
     }
     created() {
         super.created(), this.initEvent(), this._bindRegions(), this._bindLinkedSeries(), 
         this._initRegionAxisMap(), this._initAxisDataZoomMap(), this._initNeedOperatedItem();
     }
-    _extendDataInBrush(elementsMap) {
-        var _a, _b;
-        const data = [];
-        for (const brushName in elementsMap) for (const elementKey in elementsMap[brushName]) data.push(Object.assign({}, null === (_b = null === (_a = elementsMap[brushName][elementKey]) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b[0]));
-        return data;
+    _bindRegions() {
+        (0, vutils_1.isValid)(this._spec.regionId) || (0, vutils_1.isValid)(this._spec.regionIndex) ? this._relativeRegions = this._option.getRegionsInUserIdOrIndex((0, 
+        vutils_1.array)(this._spec.regionId), (0, vutils_1.array)(this._spec.regionIndex)) : this._relativeRegions = this._option.getAllRegions();
     }
-    _extendDatumOutOfBrush(elementsMap) {
-        var _a;
-        const data = [];
-        for (const elementKey in elementsMap) data.push(null === (_a = elementsMap[elementKey].data) || void 0 === _a ? void 0 : _a[0]);
-        return data;
+    _bindLinkedSeries() {
+        ((0, vutils_1.isValid)(this._spec.brushLinkSeriesId) || (0, vutils_1.isValid)(this._spec.brushLinkSeriesIndex)) && (this._linkedSeries = this._option.getSeriesInUserIdOrIndex((0, 
+        vutils_1.array)(this._spec.brushLinkSeriesId), (0, vutils_1.array)(this._spec.brushLinkSeriesIndex)));
     }
-    _getBrushInteractiveAttr(region) {
-        const regionLayoutPosition = region.getLayoutStartPoint(), regionLayoutRect = region.getLayoutRect(), seriesRegionStartX = regionLayoutPosition.x, seriesRegionEndX = seriesRegionStartX + regionLayoutRect.width, seriesRegionStartY = regionLayoutPosition.y, seriesRegionEndY = seriesRegionStartY + regionLayoutRect.height;
-        return {
-            interactiveRange: {
-                minY: seriesRegionStartY,
-                maxY: seriesRegionEndY,
-                minX: seriesRegionStartX,
-                maxX: seriesRegionEndX
-            },
-            xRange: [ seriesRegionStartX, seriesRegionEndX ],
-            yRange: [ seriesRegionStartY, seriesRegionEndY ]
-        };
+    _initRegionAxisMap() {
+        (0, vutils_1.isValid)(this._spec.axisId) ? (0, vutils_1.array)(this._spec.axisId).forEach((axisId => {
+            this._releatedAxes.push(this._option.getComponentByUserId(axisId));
+        })) : (0, vutils_1.isValid)(this._spec.axisIndex) ? (0, vutils_1.array)(this._spec.axisIndex).forEach((axisIndex => {
+            this._releatedAxes.push(this._option.getComponentByIndex("axes", axisIndex));
+        })) : this._releatedAxes = this._option.getComponentsByKey("axes"), this._releatedAxes.forEach((axis => {
+            null == axis || axis.getRegions().forEach((region => {
+                this._regionAxisMap["region_" + region.id] ? this._regionAxisMap["region_" + region.id].push(axis) : this._regionAxisMap["region_" + region.id] = [ axis ];
+            }));
+        }));
+    }
+    _initAxisDataZoomMap() {
+        this._option.getComponentsByKey("dataZoom").forEach((dz => {
+            dz.relatedAxisComponent && (this._axisDataZoomMap[dz.relatedAxisComponent.id] = dz);
+        }));
+    }
+    initEvent() {}
+    onRender(ctx) {}
+    changeRegions(regions) {}
+    _compareSpec(spec, prevSpec) {
+        this._brushComponents && this._relativeRegions.forEach(((region, index) => {
+            this._updateBrushComponent(region, index);
+        }));
+        const result = super._compareSpec(spec, prevSpec);
+        return (0, vutils_2.isEqual)(prevSpec, spec) || (result.reRender = !0, result.reMake = !0), 
+        result;
+    }
+    onLayoutEnd(ctx) {
+        var _a;
+        if (super.onLayoutEnd(ctx), this._option.disableTriggerEvent) return;
+        (null === (_a = this._spec.visible) || void 0 === _a || _a) && (this._brushComponents ? this._relativeRegions.forEach(((region, index) => {
+            this._updateBrushComponent(region, index);
+        })) : (this._brushComponents = [], this._relativeRegions.forEach(((region, index) => {
+            this._createBrushComponent(region, index);
+        }))));
     }
     _updateBrushComponent(region, componentIndex) {
         const interactiveAttr = this._getBrushInteractiveAttr(region), brushComponent = this._brushComponents[componentIndex];
         brushComponent.setAttributes(interactiveAttr), this._initMarkBrushState(componentIndex, ""), 
-        brushComponent.children[0].removeAllChild(), this._needInitOutState = !0;
+        brushComponent.children[0].removeAllChild();
     }
     _createBrushComponent(region, componentIndex) {
         var _a, _b;
@@ -70,43 +102,75 @@ class Brush extends base_component_1.BaseComponent {
             disableTriggerEvent: this._option.disableTriggerEvent
         }));
         brush.id = null !== (_b = this._spec.id) && void 0 !== _b ? _b : `brush-${this.id}`, 
-        this.getContainer().add(brush);
-        const {brushMode: brushMode = "single"} = this._spec;
-        this._brushComponents.push(brush), this._cacheInteractiveRangeAttrs.push(interactiveAttr), 
-        brush.addEventListener(vrender_components_1.IOperateType.drawStart, (e => {
+        this.getContainer().add(brush), this._brushComponents.push(brush), this._cacheInteractiveRangeAttrs.push(interactiveAttr), 
+        brush.addEventListener(vrender_components_1.IOperateType.brushActive, (e => {
+            this._initMarkBrushState(componentIndex, "outOfBrush"), this._emitEvent(event_1.ChartEvent.brushActive, region);
+        })), brush.addEventListener(vrender_components_1.IOperateType.drawStart, (e => {
             this._emitEvent(event_1.ChartEvent.brushStart, region);
         })), brush.addEventListener(vrender_components_1.IOperateType.moveStart, (e => {
             this._emitEvent(event_1.ChartEvent.brushStart, region);
         })), brush.addEventListener(vrender_components_1.IOperateType.drawing, (e => {
-            this._needInitOutState && "single" === brushMode && this._initMarkBrushState(componentIndex, "outOfBrush"), 
-            this._needInitOutState = !1, this._needDisablePickable = !0, this._handleBrushChange(event_1.ChartEvent.brushChange, region, e), 
-            this._emitEvent(event_1.ChartEvent.brushChange, region);
+            this._needDisablePickable = !0, this._handleBrushChange(region, e), this._emitEvent(event_1.ChartEvent.brushChange, region);
         })), brush.addEventListener(vrender_components_1.IOperateType.moving, (e => {
-            this._handleBrushChange(event_1.ChartEvent.brushChange, region, e), this._emitEvent(event_1.ChartEvent.brushChange, region);
+            this._handleBrushChange(region, e), this._emitEvent(event_1.ChartEvent.brushChange, region);
         })), brush.addEventListener(vrender_components_1.IOperateType.brushClear, (e => {
-            this._initMarkBrushState(componentIndex, ""), this._needInitOutState = !0, this._needDisablePickable = !1, 
-            this._handleBrushChange(event_1.ChartEvent.brushChange, region, e), this._handleBrushChange(event_1.ChartEvent.brushClear, region, e), 
-            this._emitEvent(event_1.ChartEvent.brushChange, region), this._emitEvent(event_1.ChartEvent.brushClear, region);
+            this._initMarkBrushState(componentIndex, ""), this._needDisablePickable = !1, this._emitEvent(event_1.ChartEvent.brushClear, region);
         })), brush.addEventListener(vrender_components_1.IOperateType.drawEnd, (e => {
-            this._needInitOutState = !0, this._needDisablePickable = !1;
+            var _a;
+            this._needDisablePickable = !1;
             const {operateMask: operateMask} = e.detail;
-            this._handleBrushChange(event_1.ChartEvent.brushEnd, region, e);
-            const inBrushData = this._extendDataInBrush(this._inBrushElementsMap);
-            !this._spec.zoomWhenEmpty && inBrushData.length > 0 && this._setAxisAndDataZoom(operateMask, region), 
-            this._emitEvent(event_1.ChartEvent.brushEnd, region);
+            if (null === (_a = this._spec) || void 0 === _a ? void 0 : _a.onBrushEnd) !0 === this._spec.onBrushEnd(e) ? (this.clearGraphic(), 
+            this._initMarkBrushState(componentIndex, ""), this._needDisablePickable = !1, this._emitEvent(event_1.ChartEvent.brushClear, region)) : (this._spec.onBrushEnd(e), 
+            this._emitEvent(event_1.ChartEvent.brushEnd, region)); else {
+                const inBrushData = this._extendDataInBrush(this._inBrushElementsMap);
+                !this._spec.zoomWhenEmpty && inBrushData.length > 0 && this._setAxisAndDataZoom(operateMask, region), 
+                this._emitEvent(event_1.ChartEvent.brushEnd, region);
+            }
         })), brush.addEventListener(vrender_components_1.IOperateType.moveEnd, (e => {
-            const {operateMask: operateMask} = e.detail;
-            this._handleBrushChange(event_1.ChartEvent.brushEnd, region, e);
-            const inBrushData = this._extendDataInBrush(this._inBrushElementsMap);
+            const {operateMask: operateMask} = e.detail, inBrushData = this._extendDataInBrush(this._inBrushElementsMap);
             !this._spec.zoomWhenEmpty && inBrushData.length > 0 && this._setAxisAndDataZoom(operateMask, region), 
             this._emitEvent(event_1.ChartEvent.brushEnd, region);
         }));
     }
-    _handleBrushChange(eventType, region, e) {
+    _getBrushInteractiveAttr(region) {
+        const regionLayoutPosition = region.getLayoutStartPoint(), regionLayoutRect = region.getLayoutRect(), seriesRegionStartX = regionLayoutPosition.x, seriesRegionEndX = seriesRegionStartX + regionLayoutRect.width, seriesRegionStartY = regionLayoutPosition.y, seriesRegionEndY = seriesRegionStartY + regionLayoutRect.height;
+        return {
+            interactiveRange: {
+                minY: seriesRegionStartY,
+                maxY: seriesRegionEndY,
+                minX: seriesRegionStartX,
+                maxX: seriesRegionEndX
+            },
+            xRange: [ seriesRegionStartX, seriesRegionEndX ],
+            yRange: [ seriesRegionStartY, seriesRegionEndY ]
+        };
+    }
+    _transformBrushedMarkAttr(brushedStyle) {
+        const styleResult = {};
+        return (null == brushedStyle ? void 0 : brushedStyle.symbol) && (styleResult.symbolType = brushedStyle.symbol), 
+        (null == brushedStyle ? void 0 : brushedStyle.symbolSize) && (styleResult.size = brushedStyle.symbolSize), 
+        (null == brushedStyle ? void 0 : brushedStyle.color) && (styleResult.fill = brushedStyle.color), 
+        (null == brushedStyle ? void 0 : brushedStyle.colorAlpha) && (styleResult.fillOpacity = brushedStyle.colorAlpha), 
+        Object.assign(Object.assign({}, (0, style_1.transformToGraphic)(brushedStyle)), styleResult);
+    }
+    _handleBrushChange(region, e) {
         const {operateMask: operateMask} = e.detail;
         this._reconfigItem(operateMask, region), this._reconfigLinkedItem(operateMask, region);
     }
+    _extendDataInBrush(elementsMap) {
+        var _a, _b;
+        const data = [];
+        for (const brushName in elementsMap) for (const elementKey in elementsMap[brushName]) data.push(Object.assign({}, null === (_b = null === (_a = elementsMap[brushName][elementKey]) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b[0]));
+        return data;
+    }
+    _extendDatumOutOfBrush(elementsMap) {
+        var _a;
+        const data = [];
+        for (const elementKey in elementsMap) data.push(null === (_a = elementsMap[elementKey].data) || void 0 === _a ? void 0 : _a[0]);
+        return data;
+    }
     _emitEvent(eventType, region) {
+        var _a;
         this.event.emit(eventType, {
             model: this,
             value: {
@@ -121,103 +185,113 @@ class Brush extends base_component_1.BaseComponent {
                 linkedInBrushElementsMap: this._linkedInBrushElementsMap,
                 linkedOutOfBrushElementsMap: this._linkedOutOfBrushElementsMap,
                 zoomRecord: this._zoomRecord
-            }
+            },
+            vchart: null === (_a = this._option) || void 0 === _a ? void 0 : _a.globalInstance
         });
     }
-    _transformBrushedMarkAttr(brushedStyle) {
-        const styleResult = {};
-        return (null == brushedStyle ? void 0 : brushedStyle.symbol) && (styleResult.symbolType = brushedStyle.symbol), 
-        (null == brushedStyle ? void 0 : brushedStyle.symbolSize) && (styleResult.size = brushedStyle.symbolSize), 
-        (null == brushedStyle ? void 0 : brushedStyle.color) && (styleResult.fill = brushedStyle.color), 
-        (null == brushedStyle ? void 0 : brushedStyle.colorAlpha) && (styleResult.fillOpacity = brushedStyle.colorAlpha), 
-        Object.assign(Object.assign({}, (0, style_1.transformToGraphic)(brushedStyle)), styleResult);
-    }
     _reconfigItem(operateMask, region) {
+        var _a, _b, _c;
+        if (!(null == operateMask ? void 0 : operateMask.globalTransMatrix) || !(null === (_a = null == operateMask ? void 0 : operateMask.attribute) || void 0 === _a ? void 0 : _a.points)) return;
+        const points = null !== (_c = null === (_b = null == operateMask ? void 0 : operateMask.attribute) || void 0 === _b ? void 0 : _b.points) && void 0 !== _c ? _c : [], {a: a, b: b, c: c, d: d, e: e, f: f} = operateMask.globalTransMatrix, pointsCoord = points.map((p => ({
+            x: a * p.x + c * p.y + e,
+            y: b * p.x + d * p.y + f
+        }))), {markTypeFilter: markTypeFilter = []} = this._spec;
         this._itemMap[region.id].forEach((mark => {
+            if (markTypeFilter.includes(mark.type)) return;
             const grammarMark = mark.getProduct();
             if (!grammarMark || !grammarMark.elements || !grammarMark.elements.length) return;
             grammarMark.elements.forEach((el => {
                 var _a, _b, _c;
-                const graphicItem = el.getGraphicItem(), elementKey = mark.id + "_" + el.key;
-                (null === (_a = this._outOfBrushElementsMap) || void 0 === _a ? void 0 : _a[elementKey]) && this._isBrushContainItem(operateMask, graphicItem) ? (el.addState("inBrush"), 
+                const graphicItem = el.getGraphicItem(), elementKey = mark.id + "_" + el.key, isBrushContainItem = this._isBrushContainItem(operateMask.globalAABBBounds, pointsCoord, graphicItem);
+                (null === (_a = this._outOfBrushElementsMap) || void 0 === _a ? void 0 : _a[elementKey]) && isBrushContainItem ? (el.addState("inBrush"), 
                 this._inBrushElementsMap[null == operateMask ? void 0 : operateMask.name] || (this._inBrushElementsMap[null == operateMask ? void 0 : operateMask.name] = {}), 
                 this._inBrushElementsMap[null == operateMask ? void 0 : operateMask.name][elementKey] = el, 
-                delete this._outOfBrushElementsMap[elementKey]) : (null === (_c = null === (_b = this._inBrushElementsMap) || void 0 === _b ? void 0 : _b[null == operateMask ? void 0 : operateMask.name]) || void 0 === _c ? void 0 : _c[elementKey]) && !this._isBrushContainItem(operateMask, graphicItem) && (el.removeState("inBrush"), 
+                delete this._outOfBrushElementsMap[elementKey]) : (null === (_c = null === (_b = this._inBrushElementsMap) || void 0 === _b ? void 0 : _b[null == operateMask ? void 0 : operateMask.name]) || void 0 === _c ? void 0 : _c[elementKey]) && !isBrushContainItem && (el.removeState("inBrush"), 
                 el.addState("outOfBrush"), this._outOfBrushElementsMap[elementKey] = el, delete this._inBrushElementsMap[operateMask.name][elementKey]), 
                 graphicItem.setAttribute("pickable", !this._needDisablePickable);
             }));
         }));
     }
     _reconfigLinkedItem(operateMask, region) {
+        var _a;
+        if (!(null == operateMask ? void 0 : operateMask.globalTransMatrix) || !(null === (_a = null == operateMask ? void 0 : operateMask.attribute) || void 0 === _a ? void 0 : _a.points)) return;
         const regionLayoutPos = region.getLayoutStartPoint(), seriesId = region.getSeries().map((s => s.id));
         this._linkedSeries.forEach((s => {
+            var _a, _b;
             if (!seriesId.includes(s.id)) {
-                const sRegionLayoutPos = s.getRegion().getLayoutStartPoint(), regionOffsetX = sRegionLayoutPos.x - regionLayoutPos.x, regionOffsetY = sRegionLayoutPos.y - regionLayoutPos.y;
+                const sRegionLayoutPos = s.getRegion().getLayoutStartPoint(), regionOffsetX = sRegionLayoutPos.x - regionLayoutPos.x, regionOffsetY = sRegionLayoutPos.y - regionLayoutPos.y, points = null !== (_b = null === (_a = null == operateMask ? void 0 : operateMask.attribute) || void 0 === _a ? void 0 : _a.points) && void 0 !== _b ? _b : [], {a: a, b: b, c: c, d: d, e: e, f: f} = operateMask.globalTransMatrix, dx = regionOffsetX || 0, dy = regionOffsetY || 0, pointsCoord = points.map((p => ({
+                    x: a * p.x + c * p.y + e + dx,
+                    y: b * p.x + d * p.y + f + dy
+                })));
+                operateMask.globalAABBBounds.clone().set(operateMask.globalAABBBounds.x1 + dx, operateMask.globalAABBBounds.y1 + dy, operateMask.globalAABBBounds.x2 + dx, operateMask.globalAABBBounds.y2 + dy);
+                const {markTypeFilter: markTypeFilter = []} = this._spec;
                 this._linkedItemMap[s.id].forEach((mark => {
+                    if (markTypeFilter.includes(mark.type)) return;
                     const grammarMark = mark.getProduct();
                     if (!grammarMark || !grammarMark.elements || !grammarMark.elements.length) return;
                     grammarMark.elements.forEach((el => {
                         var _a, _b, _c;
                         const graphicItem = el.getGraphicItem(), elementKey = mark.id + "_" + el.key;
-                        (null === (_a = this._linkedOutOfBrushElementsMap) || void 0 === _a ? void 0 : _a[elementKey]) && this._isBrushContainItem(operateMask, graphicItem, {
-                            dx: regionOffsetX,
-                            dy: regionOffsetY
-                        }) ? (el.addState("inBrush"), this._linkedInBrushElementsMap[null == operateMask ? void 0 : operateMask.name] || (this._linkedInBrushElementsMap[null == operateMask ? void 0 : operateMask.name] = {}), 
+                        (null === (_a = this._linkedOutOfBrushElementsMap) || void 0 === _a ? void 0 : _a[elementKey]) && this._isBrushContainItem(operateMask.globalAABBBounds, pointsCoord, graphicItem) ? (el.addState("inBrush"), 
+                        this._linkedInBrushElementsMap[null == operateMask ? void 0 : operateMask.name] || (this._linkedInBrushElementsMap[null == operateMask ? void 0 : operateMask.name] = {}), 
                         this._linkedInBrushElementsMap[null == operateMask ? void 0 : operateMask.name][elementKey] = el, 
-                        delete this._linkedOutOfBrushElementsMap[elementKey]) : (null === (_c = null === (_b = this._linkedInBrushElementsMap) || void 0 === _b ? void 0 : _b[null == operateMask ? void 0 : operateMask.name]) || void 0 === _c ? void 0 : _c[elementKey]) && !this._isBrushContainItem(operateMask, graphicItem, {
-                            dx: regionOffsetX,
-                            dy: regionOffsetY
-                        }) && (el.removeState("inBrush"), el.addState("outOfBrush"), this._linkedOutOfBrushElementsMap[elementKey] = el), 
+                        delete this._linkedOutOfBrushElementsMap[elementKey]) : (null === (_c = null === (_b = this._linkedInBrushElementsMap) || void 0 === _b ? void 0 : _b[null == operateMask ? void 0 : operateMask.name]) || void 0 === _c ? void 0 : _c[elementKey]) && !this._isBrushContainItem(operateMask.globalAABBBounds, pointsCoord, graphicItem) && (el.removeState("inBrush"), 
+                        el.addState("outOfBrush"), this._linkedOutOfBrushElementsMap[elementKey] = el), 
                         graphicItem.setAttribute("pickable", !this._needDisablePickable);
                     }));
                 }));
             }
         }));
     }
-    _isBrushContainItem(brushMask, item, linkedOffset) {
-        var _a, _b, _c;
-        if (!(null == brushMask ? void 0 : brushMask.globalTransMatrix) || !(null === (_a = null == brushMask ? void 0 : brushMask.attribute) || void 0 === _a ? void 0 : _a.points)) return !1;
-        const points = null !== (_c = null === (_b = null == brushMask ? void 0 : brushMask.attribute) || void 0 === _b ? void 0 : _b.points) && void 0 !== _c ? _c : [], {a: a, b: b, c: c, d: d, e: e, f: f} = brushMask.globalTransMatrix, dx = (null == linkedOffset ? void 0 : linkedOffset.dx) || 0, dy = (null == linkedOffset ? void 0 : linkedOffset.dy) || 0, pointsCoord = points.map((p => ({
-            x: a * p.x + c * p.y + e + dx,
-            y: b * p.x + d * p.y + f + dy
-        })));
-        brushMask.globalAABBBounds.clone().set(brushMask.globalAABBBounds.x1 + dx, brushMask.globalAABBBounds.y1 + dy, brushMask.globalAABBBounds.x2 + dx, brushMask.globalAABBBounds.y2 + dy);
-        const x = item.globalTransMatrix.e, y = item.globalTransMatrix.f;
+    _isBrushContainItem(brushMaskAABBBounds, brushMaskPointsCoord, item) {
         let itemBounds = [];
-        if ("symbol" === item.type) {
-            const {size: itemSize = 0} = null == item ? void 0 : item.attribute, size = (0, 
-            vutils_1.array)(itemSize)[0] / 2;
-            return itemBounds = [ {
-                x: x - size,
-                y: y - size
-            }, {
-                x: x + size,
-                y: y - size
-            }, {
-                x: x + size,
-                y: y + size
-            }, {
-                x: x - size,
-                y: y + size
-            } ], (0, vutils_1.polygonIntersectPolygon)(pointsCoord, itemBounds);
-        }
-        if ("rect" === item.type) {
-            const {x1: x1, x2: x2, y1: y1, y2: y2} = null == item ? void 0 : item.AABBBounds, width = Math.abs(x1 - x2), height = Math.abs(y1 - y2);
+        if ([ "symbol", "rect" ].includes(item.type)) {
+            const {x1: x1, x2: x2, y1: y1, y2: y2} = null == item ? void 0 : item.globalAABBBounds;
             return itemBounds = [ {
-                x: x,
-                y: y
+                x: x1,
+                y: y1
             }, {
-                x: x + width,
-                y: y
+                x: x2,
+                y: y1
             }, {
-                x: x + width,
-                y: y + height
+                x: x2,
+                y: y2
             }, {
-                x: x,
-                y: y + height
-            } ], (0, vutils_1.polygonIntersectPolygon)(pointsCoord, itemBounds);
+                x: x1,
+                y: y2
+            } ], (0, vutils_1.polygonIntersectPolygon)(brushMaskPointsCoord, itemBounds);
         }
-        return brushMask.globalAABBBounds.intersects(item.globalAABBBounds);
+        return brushMaskAABBBounds.intersects(item.globalAABBBounds);
+    }
+    _initMarkBrushState(componentIndex, stateName) {
+        this._brushComponents.forEach(((brush, index) => {
+            index !== componentIndex && brush.children[0].removeAllChild();
+        })), this._inBrushElementsMap = {}, this._outOfBrushElementsMap = {}, this._linkedInBrushElementsMap = {}, 
+        this._linkedOutOfBrushElementsMap = {};
+        const {markTypeFilter: markTypeFilter = []} = this._spec;
+        Object.entries(this._itemMap).forEach((([regionId, marks]) => {
+            marks.forEach((mark => {
+                if (markTypeFilter.includes(mark.type)) return;
+                const grammarMark = mark.getProduct();
+                if (!grammarMark || !grammarMark.elements || !grammarMark.elements.length) return;
+                grammarMark.elements.forEach((el => {
+                    const elementKey = mark.id + "_" + el.key;
+                    el.removeState("inBrush"), el.removeState("outOfBrush"), el.addState(stateName), 
+                    this._outOfBrushElementsMap[elementKey] = el;
+                }));
+            }));
+        })), Object.entries(this._linkedItemMap).forEach((([seriesId, marks]) => {
+            marks.forEach((mark => {
+                if (markTypeFilter.includes(mark.type)) return;
+                const grammarMark = mark.getProduct();
+                if (!grammarMark || !grammarMark.elements || !grammarMark.elements.length) return;
+                grammarMark.elements.forEach((el => {
+                    const elementKey = mark.id + "_" + el.key;
+                    el.removeState("inBrush"), el.removeState("outOfBrush"), el.addState(stateName), 
+                    this._linkedOutOfBrushElementsMap[elementKey] = el;
+                }));
+            }));
+        }));
     }
     _stateClamp(state) {
         return Math.min(Math.max(0, state), 1);
@@ -255,83 +329,9 @@ class Brush extends base_component_1.BaseComponent {
             }));
         }
     }
-    _bindRegions() {
-        (0, vutils_1.isValid)(this._spec.regionId) && (0, vutils_1.isValid)(this._spec.regionIndex) && (this._relativeRegions = this._option.getAllRegions()), 
-        this._relativeRegions = this._option.getRegionsInUserIdOrIndex((0, vutils_1.array)(this._spec.regionId), (0, 
-        vutils_1.array)(this._spec.regionIndex));
-    }
-    _bindLinkedSeries() {
-        (0, vutils_1.isValid)(this._spec.brushLinkSeriesId) && (0, vutils_1.isValid)(this._spec.brushLinkSeriesIndex) || (this._linkedSeries = this._option.getSeriesInUserIdOrIndex((0, 
-        vutils_1.array)(this._spec.brushLinkSeriesId), (0, vutils_1.array)(this._spec.brushLinkSeriesIndex)));
-    }
-    _initRegionAxisMap() {
-        (0, vutils_1.isValid)(this._spec.axisId) ? (0, vutils_1.array)(this._spec.axisId).forEach((axisId => {
-            this._releatedAxes.push(this._option.getComponentByUserId(axisId));
-        })) : (0, vutils_1.isValid)(this._spec.axisIndex) ? (0, vutils_1.array)(this._spec.axisIndex).forEach((axisIndex => {
-            this._releatedAxes.push(this._option.getComponentByIndex("axes", axisIndex));
-        })) : this._releatedAxes = this._option.getComponentsByKey("axes"), this._releatedAxes.forEach((axis => {
-            null == axis || axis.getRegions().forEach((region => {
-                this._regionAxisMap["region_" + region.id] ? this._regionAxisMap["region_" + region.id].push(axis) : this._regionAxisMap["region_" + region.id] = [ axis ];
-            }));
-        }));
-    }
-    _initAxisDataZoomMap() {
-        this._option.getComponentsByKey("dataZoom").forEach((dz => {
-            dz.relatedAxisComponent && (this._axisDataZoomMap[dz.relatedAxisComponent.id] = dz);
-        }));
-    }
-    _initNeedOperatedItem() {
-        const seriesUserId = this._spec.seriesId, seriesIndex = this._spec.seriesIndex;
-        this._relativeRegions.forEach((r => {
-            const allMarks = [];
-            r.getSeries().forEach((s => {
-                (seriesUserId && (0, vutils_1.array)(seriesUserId).includes(s.userId.toString()) || seriesIndex && (0, 
-                vutils_1.array)(seriesIndex).includes(s.getSpecIndex()) || !seriesIndex && !seriesUserId) && allMarks.push(...s.getMarksWithoutRoot()), 
-                this._itemMap[r.id] = allMarks;
-            }));
-        })), this._linkedSeries.forEach((s => {
-            this._linkedItemMap[s.id] = s.getMarksWithoutRoot();
-        }));
-    }
-    _initMarkBrushState(componentIndex, stateName) {
-        this._brushComponents.forEach(((brush, index) => {
-            index !== componentIndex && brush.children[0].removeAllChild();
-        })), this._inBrushElementsMap = {}, this._outOfBrushElementsMap = {}, this._linkedInBrushElementsMap = {}, 
-        this._linkedOutOfBrushElementsMap = {}, this._option.getAllSeries().forEach((s => {
-            s.getMarksWithoutRoot().forEach((mark => {
-                const grammarMark = mark.getProduct();
-                if (!grammarMark || !grammarMark.elements || !grammarMark.elements.length) return;
-                grammarMark.elements.forEach((el => {
-                    const elementKey = mark.id + "_" + el.key;
-                    el.removeState("inBrush"), el.removeState("outOfBrush"), el.addState(stateName), 
-                    this._outOfBrushElementsMap[elementKey] = el, this._linkedOutOfBrushElementsMap[elementKey] = el;
-                }));
-            }));
-        }));
-    }
-    initEvent() {}
-    onRender(ctx) {}
-    changeRegions(regions) {}
     _getNeedClearVRenderComponents() {
         return this._brushComponents;
     }
-    _compareSpec(spec, prevSpec) {
-        this._brushComponents && this._relativeRegions.forEach(((region, index) => {
-            this._updateBrushComponent(region, index);
-        }));
-        const result = super._compareSpec(spec, prevSpec);
-        return (0, vutils_2.isEqual)(prevSpec, spec) || (result.reRender = !0, result.reMake = !0), 
-        result;
-    }
-    onLayoutEnd(ctx) {
-        var _a;
-        if (super.onLayoutEnd(ctx), this._option.disableTriggerEvent) return;
-        (null === (_a = this._spec.visible) || void 0 === _a || _a) && (this._brushComponents ? this._relativeRegions.forEach(((region, index) => {
-            this._updateBrushComponent(region, index);
-        })) : (this._brushComponents = [], this._relativeRegions.forEach(((region, index) => {
-            this._createBrushComponent(region, index);
-        }))));
-    }
     clearGraphic() {
         this._brushComponents && this._brushComponents.forEach((brush => {
             brush._container.incrementalClearChild();
@@ -340,8 +340,9 @@ class Brush extends base_component_1.BaseComponent {
     clear() {
         if (this._brushComponents) {
             const container = this.getContainer();
-            this._brushComponents.forEach((brush => {
-                brush.removeAllChild(), brush.releaseBrushEvents(), container && container.removeChild(brush);
+            this._brushComponents.forEach(((brush, index) => {
+                this._initMarkBrushState(index, ""), this._needDisablePickable = !1, brush.removeAllChild(), 
+                brush.releaseBrushEvents(), container && container.removeChild(brush);
             })), this._brushComponents = null;
         }
     }