diff --git a/common/changes/@visactor/vchart/feat-brush-api_2026-01-04-12-02.json b/common/changes/@visactor/vchart/feat-brush-api_2026-01-04-12-02.json new file mode 100644 index 0000000000..9b9944b4b5 --- /dev/null +++ b/common/changes/@visactor/vchart/feat-brush-api_2026-01-04-12-02.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "feat: add brush api before change", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file diff --git a/common/changes/@visactor/vchart/feat-brush-api_2026-01-05-09-41.json b/common/changes/@visactor/vchart/feat-brush-api_2026-01-05-09-41.json new file mode 100644 index 0000000000..2f4c372c85 --- /dev/null +++ b/common/changes/@visactor/vchart/feat-brush-api_2026-01-05-09-41.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "git commit -m 'feat: add interactive api", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file diff --git a/common/changes/@visactor/vchart/feat-brush-api_2026-01-07-03-54.json b/common/changes/@visactor/vchart/feat-brush-api_2026-01-07-03-54.json new file mode 100644 index 0000000000..fbef58a0fd --- /dev/null +++ b/common/changes/@visactor/vchart/feat-brush-api_2026-01-07-03-54.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "feat: add brush clear api and disable dimension hover config. close#4400", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file diff --git a/common/changes/@visactor/vchart/pre-release-2.0.13-alpha.9_2026-01-19-07-28.json b/common/changes/@visactor/vchart/pre-release-2.0.13-alpha.9_2026-01-19-07-28.json new file mode 100644 index 0000000000..c1736bcb15 --- /dev/null +++ b/common/changes/@visactor/vchart/pre-release-2.0.13-alpha.9_2026-01-19-07-28.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "feat: interactive params add event. feat #4421", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file diff --git a/packages/vchart/src/compile/compiler.ts b/packages/vchart/src/compile/compiler.ts index ae7747b19a..6ae4edc2b2 100644 --- a/packages/vchart/src/compile/compiler.ts +++ b/packages/vchart/src/compile/compiler.ts @@ -71,6 +71,9 @@ export class Compiler implements ICompiler { protected _container: IRenderContainer; protected _option: IRenderOption; + getOption() { + return this._option; + } // 已释放标记 private _released: boolean = false; @@ -498,8 +501,8 @@ export class Compiler implements ICompiler { const animationState = markAnimationStates.every(state => state === AnimationStateEnum.appear) ? AnimationStateEnum.appear : markAnimationStates.every(state => state === AnimationStateEnum.disappear) - ? AnimationStateEnum.disappear - : AnimationStateEnum.none; + ? AnimationStateEnum.disappear + : AnimationStateEnum.none; if (!this._stage.context) { this._stage.context = {}; } diff --git a/packages/vchart/src/compile/interface/compilable-item.ts b/packages/vchart/src/compile/interface/compilable-item.ts index 3d57ee2684..acc94d112e 100644 --- a/packages/vchart/src/compile/interface/compilable-item.ts +++ b/packages/vchart/src/compile/interface/compilable-item.ts @@ -6,7 +6,7 @@ import type { IMorphConfig } from '../../animation/spec'; import type { IBoundsLike } from '@visactor/vutils'; import type { EventSourceType, EventType } from '../../event/interface'; import type { IMark, IMarkGraphic } from '../../mark/interface'; -import type { LayoutState } from '../interface/compiler'; +import type { IRenderOption, LayoutState } from '../interface/compiler'; import type { MarkAnimationSpec } from '../../animation/interface'; export type CompilerListenerParameters = { @@ -34,6 +34,7 @@ export interface IGrammarItemMap { export type ICompilerModel = Record>; export interface ICompiler { + getOption: () => IRenderOption; isInited?: boolean; readonly stateAnimationConfig?: MarkAnimationSpec; getCanvas: () => HTMLCanvasElement | undefined; diff --git a/packages/vchart/src/component/brush/brush.ts b/packages/vchart/src/component/brush/brush.ts index 5ee7fa599b..22b43a4ccb 100644 --- a/packages/vchart/src/component/brush/brush.ts +++ b/packages/vchart/src/component/brush/brush.ts @@ -8,7 +8,7 @@ import { Brush as BrushComponent, IOperateType as BrushEvent } from '@visactor/v import type { IBounds, IPointLike, Maybe } from '@visactor/vutils'; // eslint-disable-next-line no-duplicate-imports import { array, polygonIntersectPolygon, isValid, last } from '@visactor/vutils'; -import type { IModelRenderOption, IModelSpecInfo } from '../../model/interface'; +import type { IModelSpecInfo } from '../../model/interface'; import type { IRegion } from '../../region/interface'; import type { IGraphic, IGroup, INode, IPolygon } from '@visactor/vrender-core'; import { transformToGraphic } from '../../util/style'; @@ -24,6 +24,7 @@ import { getSpecInfo } from '../util'; import { brush } from '../../theme/builtin/common/component/brush'; import { isReverse, statePointToData } from '../data-zoom/util'; import type { CartesianAxis } from '../axis/cartesian'; +import type { IRenderOption } from '../../compile/interface'; const IN_BRUSH_STATE = 'inBrush'; const OUT_BRUSH_STATE = 'outOfBrush'; @@ -47,6 +48,8 @@ export class Brush extends BaseComponent i protected _relativeRegions!: IRegion[]; protected _linkedSeries: ISeries[] = []; + protected _operateMask: IPolygon; + private _itemMap: { [regionId: string | number]: IMark[] } = {}; private _linkedItemMap: { [seriesId: string | number]: IMark[] } = {}; @@ -249,6 +252,10 @@ export class Brush extends BaseComponent i brushComponent.children[0].removeAllChild(); } + protected _shouldEnableInteractive() { + return (this.getOption().getCompiler().getOption() as IRenderOption).interactive !== false; + } + protected _createBrushComponent(region: IRegion, componentIndex: number) { const interactiveAttr = this._getBrushInteractiveAttr(region); const brush = new BrushComponent({ @@ -265,38 +272,50 @@ export class Brush extends BaseComponent i brush.addEventListener(BrushEvent.brushActive, (e: any) => { this._initMarkBrushState(componentIndex, OUT_BRUSH_STATE); - this._emitEvent(ChartEvent.brushActive, region); + this._emitEvent(ChartEvent.brushActive, region, e); }); brush.addEventListener(BrushEvent.drawStart, (e: any) => { + if (this._spec.disableDimensionHoverWhenBrushing) { + this._option.globalInstance.disableDimensionHoverEvent(true); + } this._setRegionMarkPickable(region, true); - this._emitEvent(ChartEvent.brushStart, region); + this._emitEvent(ChartEvent.brushStart, region, e); }); brush.addEventListener(BrushEvent.moveStart, (e: any) => { + if (this._spec.disableDimensionHoverWhenBrushing) { + this._option.globalInstance.disableDimensionHoverEvent(true); + } this._setRegionMarkPickable(region, true); - this._emitEvent(ChartEvent.brushStart, region); + this._emitEvent(ChartEvent.brushStart, region, e); }); brush.addEventListener(BrushEvent.drawing, (e: any) => { this._setRegionMarkPickable(region, false); this._handleBrushChange(region, e); - this._emitEvent(ChartEvent.brushChange, region); + this._emitEvent(ChartEvent.brushChange, region, e); }); brush.addEventListener(BrushEvent.moving, (e: any) => { this._setRegionMarkPickable(region, false); this._handleBrushChange(region, e); - this._emitEvent(ChartEvent.brushChange, region); + this._emitEvent(ChartEvent.brushChange, region, e); }); brush.addEventListener(BrushEvent.brushClear, (e: any) => { + if (this._spec.disableDimensionHoverWhenBrushing) { + this._option.globalInstance.disableDimensionHoverEvent(false); + } this._setRegionMarkPickable(region, true); this._initMarkBrushState(componentIndex, ''); - this._emitEvent(ChartEvent.brushClear, region); + this._emitEvent(ChartEvent.brushClear, region, e); }); brush.addEventListener(BrushEvent.drawEnd, (e: any) => { + if (this._spec.disableDimensionHoverWhenBrushing) { + this._option.globalInstance.disableDimensionHoverEvent(false); + } this._setRegionMarkPickable(region, true); const { operateMask } = e.detail as any; const { updateElementsState = true } = this._spec; @@ -305,21 +324,24 @@ export class Brush extends BaseComponent i if (this._spec.onBrushEnd(e) === true) { this.clearGraphic(); this._initMarkBrushState(componentIndex, ''); - this._emitEvent(ChartEvent.brushClear, region); + this._emitEvent(ChartEvent.brushClear, region, e); } else { this._spec.onBrushEnd(e); - this._emitEvent(ChartEvent.brushEnd, region); + this._emitEvent(ChartEvent.brushEnd, region, e); } } else { const inBrushData = this._extendDataInBrush(this._inBrushElementsMap); if ((!this._spec.zoomWhenEmpty && inBrushData.length > 0) || !updateElementsState) { this._setAxisAndDataZoom(operateMask, region); } - this._emitEvent(ChartEvent.brushEnd, region); + this._emitEvent(ChartEvent.brushEnd, region, e); } }); brush.addEventListener(BrushEvent.moveEnd, (e: any) => { + if (this._spec.disableDimensionHoverWhenBrushing) { + this._option.globalInstance.disableDimensionHoverEvent(false); + } this._setRegionMarkPickable(region, true); const { operateMask } = e.detail as any; const { updateElementsState = true } = this._spec; @@ -327,7 +349,7 @@ export class Brush extends BaseComponent i if ((!this._spec.zoomWhenEmpty && inBrushData.length > 0) || updateElementsState) { this._setAxisAndDataZoom(operateMask, region); } - this._emitEvent(ChartEvent.brushEnd, region); + this._emitEvent(ChartEvent.brushEnd, region, e); }); } @@ -346,7 +368,8 @@ export class Brush extends BaseComponent i maxX: seriesRegionEndX }, xRange: [seriesRegionStartX, seriesRegionEndX], - yRange: [seriesRegionStartY, seriesRegionEndY] + yRange: [seriesRegionStartY, seriesRegionEndY], + interactive: this._shouldEnableInteractive() } as BrushInteractiveRangeAttr; } @@ -374,6 +397,7 @@ export class Brush extends BaseComponent i /*** start: event dispatch ***/ private _handleBrushChange(region: IRegion, e: any) { const { operateMask } = e.detail as any; + this._operateMask = operateMask; const { updateElementsState = true } = this._spec; if (updateElementsState) { this._reconfigItem(operateMask, region); @@ -403,7 +427,7 @@ export class Brush extends BaseComponent i return data; } - private _emitEvent(eventType: string, region: IRegion) { + private _emitEvent(eventType: string, region: IRegion, e: any) { this.event.emit(eventType, { model: this, value: { @@ -430,7 +454,8 @@ export class Brush extends BaseComponent i // 缩放记录 zoomRecord: this._zoomRecord }, - vchart: this._option?.globalInstance + vchart: this._option?.globalInstance, + event: e }); } /*** end: event dispatch ***/ @@ -767,6 +792,12 @@ export class Brush extends BaseComponent i this._brushComponents = null; } } + clearBrushStateAndMask() { + this._relativeRegions.forEach((region: IRegion, componentIndex: number) => { + this._initMarkBrushState(componentIndex, ''); + this._brushComponents[componentIndex].children[0].removeAllChild(); + }); + } } export const registerBrush = () => { diff --git a/packages/vchart/src/component/brush/interface.ts b/packages/vchart/src/component/brush/interface.ts index dec799be6d..5e3b1475d3 100644 --- a/packages/vchart/src/component/brush/interface.ts +++ b/packages/vchart/src/component/brush/interface.ts @@ -1,4 +1,4 @@ -import type { SymbolType } from '@visactor/vrender-core'; +import type { FederatedPointerEvent, SymbolType } from '@visactor/vrender-core'; import type { IPolygonMarkSpec } from '../../typings'; import type { IComponent } from '../interface'; import type { IDelayType } from '../../typings/event'; @@ -65,6 +65,16 @@ interface IBrushDataBindSpec { * 2) 散点图按照散点中心定位, 如果严格按照中心范围更新，会出现散点超出画布的现象 */ axisRangeExpand?: number; + /** + * 框选前触发事件 + * 返回false, 则阻止后续逻辑 + */ + beforeBrushChange?: (e: FederatedPointerEvent) => void | boolean; + /** + * 是否在框选时禁用维度 hover 事件 + * @default false + */ + disableDimensionHoverWhenBrushing?: boolean; } export interface IBrushTheme { diff --git a/packages/vchart/src/component/crosshair/interface/spec.ts b/packages/vchart/src/component/crosshair/interface/spec.ts index 0e64821eb8..49ccc0291a 100644 --- a/packages/vchart/src/component/crosshair/interface/spec.ts +++ b/packages/vchart/src/component/crosshair/interface/spec.ts @@ -5,6 +5,7 @@ import type { IComponentSpec } from '../../base/interface'; import type { IComponent } from '../../interface'; export interface ICrossHair extends IComponent { + enable: boolean; clearAxisValue: () => void; setAxisValue: (v: StringOrNumber, axis: IAxis) => void; layoutByValue: (enableRemain?: boolean) => void; diff --git a/packages/vchart/src/component/tooltip/interface/common.ts b/packages/vchart/src/component/tooltip/interface/common.ts index c7509fdd87..6b4fb96fdf 100644 --- a/packages/vchart/src/component/tooltip/interface/common.ts +++ b/packages/vchart/src/component/tooltip/interface/common.ts @@ -49,4 +49,5 @@ export interface ITooltip extends IComponent { tooltipHandler?: ITooltipHandler; getVisible: () => boolean; showTooltip: (datum: Datum, options: IShowTooltipOption) => void; + enable?: boolean; } diff --git a/packages/vchart/src/component/tooltip/processor/base.ts b/packages/vchart/src/component/tooltip/processor/base.ts index f473dac2c0..4636aa90bb 100644 --- a/packages/vchart/src/component/tooltip/processor/base.ts +++ b/packages/vchart/src/component/tooltip/processor/base.ts @@ -151,6 +151,9 @@ export abstract class BaseTooltipProcessor { /** 判断是否应该触发 tooltip */ shouldHandleTooltip(params: BaseEventParams, info: TooltipInfo): boolean { + if (!this.component.enable) { + return false; + } if (isNil(info)) { return false; } diff --git a/packages/vchart/src/component/tooltip/tooltip.ts b/packages/vchart/src/component/tooltip/tooltip.ts index c781069792..30fe4ecca1 100644 --- a/packages/vchart/src/component/tooltip/tooltip.ts +++ b/packages/vchart/src/component/tooltip/tooltip.ts @@ -68,9 +68,10 @@ export class Tooltip extends BaseComponent implements ITooltip { * 是否正在浏览tooltip内容 */ private _isEnterTooltip: boolean; - protected declare _spec: ITooltipSpec; + declare protected _spec: ITooltipSpec; tooltipHandler?: ITooltipHandler; + enable?: boolean = true; processor: ITooltipActiveTypeAsKeys< ITooltipProcessor, diff --git a/packages/vchart/src/core/interface.ts b/packages/vchart/src/core/interface.ts index 1e8b35a9d1..018b8480f9 100644 --- a/packages/vchart/src/core/interface.ts +++ b/packages/vchart/src/core/interface.ts @@ -15,7 +15,7 @@ import type { } from '../typings'; import type { IMorphConfig } from '../animation/spec'; import type { IBoundsLike } from '@visactor/vutils'; -import type { EventCallback, EventQuery, EventType, ExtendEventParam } from '../event/interface'; +import type { EventCallback, EventParamsDefinition, EventQuery, EventType, ExtendEventParam } from '../event/interface'; import type { IMark, IMarkDataTransform } from '../mark/interface'; import type { ISeries } from '../series/interface/series'; import type { ITheme } from '../theme/interface'; @@ -451,6 +451,22 @@ export interface IVChart { */ setDimensionIndex: (value: StringOrNumber, options?: DimensionIndexOption) => void; + /** + * 如果传入参数, 则禁用/开启 dimension 交互事件 + * 如果不传入参数, 获取当前是否禁用 dimension 交互事件 + */ + disableDimensionHoverEvent: (disabled?: boolean) => void; + + /** + * 禁用/开启 crosshair + */ + disableCrossHair: (disabled: boolean) => void; + + /** + * 禁用/开启 tooltip + */ + disableTooltip: (disabled: boolean) => void; + // 数据转换相关的 api /** * Convert the data to coordinate position @@ -592,7 +608,10 @@ export interface VRenderComponentOptions { } export interface IStageEventPlugin { - new (taget: IEventTarget, cfg?: T): { + new ( + taget: IEventTarget, + cfg?: T + ): { release: () => void; }; } @@ -603,3 +622,9 @@ export interface GrammarTransformOption { transform: IMarkDataTransform; runType?: 'beforeJoin' | 'afterEncode'; } + +export interface UserEvent { + eType: EventType; + query: EventQuery | EventCallback; + handler?: EventCallback; +} diff --git a/packages/vchart/src/core/vchart.ts b/packages/vchart/src/core/vchart.ts index 13d475aba7..b3081dd4af 100644 --- a/packages/vchart/src/core/vchart.ts +++ b/packages/vchart/src/core/vchart.ts @@ -19,7 +19,6 @@ import type { IComponentConstructor } from '../component/interface'; import { ComponentTypeEnum } from '../component/interface/type'; import type { EventCallback, - EventParamsDefinition, EventQuery, EventType, ExtendEventParam, @@ -52,7 +51,7 @@ import { registerDataSetInstanceParser, registerDataSetInstanceTransform } from import { dataToDataView } from '../data/initialize'; import { copyDataView } from '../data/transforms/copy-data-view'; import type { ITooltipHandler } from '../typings/tooltip'; -import type { Tooltip } from '../component/tooltip'; +import type { ITooltip, Tooltip } from '../component/tooltip'; import type { Datum, IPoint, @@ -93,6 +92,7 @@ import type { IGlobalConfig, IVChart, IVChartRenderOption, + UserEvent, VChartRenderActionSource } from './interface'; import { InstanceManager } from './instance-manager'; @@ -118,6 +118,7 @@ import { registerElementSelect } from '../interaction/triggers/element-select'; import type { IVChartPluginService } from '../plugin/vchart/interface'; import { VChartPluginService } from '../plugin/vchart/plugin-service'; import { RenderStateEnum } from '../constant/animate'; +import type { ICrossHair } from '../component/crosshair'; export class VChart implements IVChart { readonly id = createID(); @@ -324,11 +325,7 @@ export class VChart implements IVChart { get event() { return this._event; } - private _userEvents: { - eType: EventType; - query: EventQuery | EventCallback; - handler?: EventCallback; - }[] = []; + private _userEvents: UserEvent[] = []; private _eventDispatcher: Maybe; private _dataSet!: Maybe; getDataSet() { @@ -369,6 +366,8 @@ export class VChart implements IVChart { private _renderState: RenderStateEnum = RenderStateEnum.render; + protected _disableDimensionHoverEvent: boolean = false; + constructor(spec: ISpec, options: IInitOption) { removeUndefined(options); this._option = { @@ -454,7 +453,7 @@ export class VChart implements IVChart { // 设置全局字体 this._setFontFamilyTheme(this.getTheme('fontFamily') as string); this._initDataSet(this._option.dataSet); - this._autoSize = isTrueBrowseEnv ? spec.autoFit ?? this._option.autoFit ?? true : false; + this._autoSize = isTrueBrowseEnv ? (spec.autoFit ?? this._option.autoFit ?? true) : false; this._bindResizeEvent(); this._bindViewEvent(); this._initChartPlugin(); @@ -1521,7 +1520,7 @@ export class VChart implements IVChart { } const lasAutoSize = this._autoSize; - this._autoSize = isTrueBrowser(this._option.mode) ? this._spec.autoFit ?? this._option.autoFit ?? true : false; + this._autoSize = isTrueBrowser(this._option.mode) ? (this._spec.autoFit ?? this._option.autoFit ?? true) : false; if (this._autoSize !== lasAutoSize) { resize = true; } @@ -1915,6 +1914,23 @@ export class VChart implements IVChart { return this._chart?.setDimensionIndex(value, opt); } + disableDimensionHoverEvent(value?: boolean) { + if (value !== undefined) { + this._disableDimensionHoverEvent = value; + } + return this._disableDimensionHoverEvent; + } + disableCrossHair(value: boolean = true) { + this.getChart() + .getComponentsByKey('crosshair') + .forEach(crosshair => ((crosshair as ICrossHair).enable = !value)); + } + disableTooltip(value: boolean = true) { + this.getChart() + .getComponentsByKey('tooltip') + .forEach(tooltip => ((tooltip as ITooltip).enable = !value)); + } + showCrosshair(cb: (axis: IAxis) => false | string | number) { this._chart?.showCrosshair(cb); } @@ -2259,7 +2275,7 @@ export class VChart implements IVChart { }; } - public runDisappearAnimation() { + runDisappearAnimation() { this._renderState = RenderStateEnum.disappear; this.getStage().eventSystem.pauseTriggerEvent(); this.getStage().applyAnimationState( diff --git a/packages/vchart/src/event/event.ts b/packages/vchart/src/event/event.ts index ca9cff5d49..2a875bc425 100644 --- a/packages/vchart/src/event/event.ts +++ b/packages/vchart/src/event/event.ts @@ -49,7 +49,7 @@ export class Event implements IEvent { if (ComposedEventCtor) { const composedEvent = new ComposedEventCtor(this._eventDispatcher, this._mode) as IComposedEvent; composedEvent.register(eType, handler); - this._composedEventMap.set(callback as EventCallback, { + this._composedEventMap.set(handler.callback as EventCallback, { eventType: eType, event: composedEvent }); diff --git a/packages/vchart/src/event/events/dimension/dimension-hover.ts b/packages/vchart/src/event/events/dimension/dimension-hover.ts index f66926e29d..2e53086039 100644 --- a/packages/vchart/src/event/events/dimension/dimension-hover.ts +++ b/packages/vchart/src/event/events/dimension/dimension-hover.ts @@ -46,7 +46,7 @@ export class DimensionHoverEvent extends DimensionEvent { } private onMouseMove = (params: BaseEventParams) => { - if (!params) { + if (!params || params.chart?.getOption()?.globalInstance?.disableDimensionHoverEvent?.()) { return; } const x = (params.event as any).viewX; @@ -84,7 +84,7 @@ export class DimensionHoverEvent extends DimensionEvent { }; private onMouseOut = (params: BaseEventParams) => { - if (!params) { + if (!params || params.chart?.getOption()?.globalInstance?.disableDimensionHoverEvent?.()) { return; } // 鼠标移出某维度 diff --git a/packages/vchart/src/interaction/interface/trigger.ts b/packages/vchart/src/interaction/interface/trigger.ts index 3228be8b4b..b24e915426 100644 --- a/packages/vchart/src/interaction/interface/trigger.ts +++ b/packages/vchart/src/interaction/interface/trigger.ts @@ -13,7 +13,7 @@ export interface ITrigger { release: () => void; init: () => void; - start: (g: any) => void; + start: (g: any, e?: BaseEventParams) => void; reset: (g?: IMarkGraphic) => void; getStartState: () => string; getResetState: () => string; diff --git a/packages/vchart/src/interaction/triggers/base.ts b/packages/vchart/src/interaction/triggers/base.ts index e3ba92a4ac..a80c390809 100644 --- a/packages/vchart/src/interaction/triggers/base.ts +++ b/packages/vchart/src/interaction/triggers/base.ts @@ -3,6 +3,7 @@ import type { IBaseTriggerOptions, ITrigger, ITriggerEventHandler } from '../int import type { IMark, IMarkGraphic } from '../../mark/interface/common'; import { MarkSet } from '../../mark/mark-set'; import { groupMarksByState } from './util'; +import type { BaseEventParams } from '../../core'; export abstract class BaseTrigger implements ITrigger { options: T; @@ -111,11 +112,11 @@ export abstract class BaseTrigger implements ITri } } - start(g: IMarkGraphic | string) { + start(g: IMarkGraphic | string, e?: BaseEventParams) { // do nothing } - reset(g?: IMarkGraphic) { + reset(g?: IMarkGraphic, e?: BaseEventParams) { // do nothing } diff --git a/packages/vchart/src/interaction/triggers/element-highlight.ts b/packages/vchart/src/interaction/triggers/element-highlight.ts index d9b1d58625..6a3bcddc80 100644 --- a/packages/vchart/src/interaction/triggers/element-highlight.ts +++ b/packages/vchart/src/interaction/triggers/element-highlight.ts @@ -65,13 +65,13 @@ export class ElementHighlight return events; } - resetAll = () => { + resetAll = (e?: BaseEventParams) => { const { highlightState, blurState, interaction } = this.options; if (this._lastGraphic) { interaction.clearAllStatesOfTrigger(this, highlightState, blurState); - this.dispatchEvent('reset', { graphics: [this._lastGraphic], options: this.options }); + this.dispatchEvent('reset', { graphics: [this._lastGraphic], options: this.options, ...e }); this._lastGraphic = null; @@ -80,7 +80,7 @@ export class ElementHighlight }; handleStart = (e: BaseEventParams) => { - this.start(e.item); + this.start(e.item, e); }; handleReset = (e: BaseEventParams) => { @@ -94,13 +94,13 @@ export class ElementHighlight const hasActiveElement = markGraphic && this._markSet.getMarkInId(markGraphic.context.markId); if (this._resetType.includes('view') && !hasActiveElement) { - this.resetAll(); + this.resetAll(e); } else if (this._resetType.includes('self') && hasActiveElement) { - this.resetAll(); + this.resetAll(e); } }; - start(markGraphic: IMarkGraphic) { + start(markGraphic: IMarkGraphic, e?: BaseEventParams) { if (markGraphic && this._markSet.getMarkInId(markGraphic.context.markId)) { const { highlightState, blurState, interaction } = this.options; @@ -119,19 +119,19 @@ export class ElementHighlight this._lastGraphic = markGraphic; - this.dispatchEvent('start', { graphics: newStatedGraphics, options: this.options }); + this.dispatchEvent('start', { graphics: newStatedGraphics, options: this.options, ...e }); } else if (this._lastGraphic && this._resetType === 'view') { - this.resetAll(); + this.resetAll(e); } } - reset(markGraphic: IMarkGraphic) { + reset(markGraphic: IMarkGraphic, e?: BaseEventParams) { if (markGraphic) { if (this._markSet.getMarkInId(markGraphic.context.markId)) { markGraphic.removeState([this.options.highlightState, this.options.blurState]); } } else { - this.resetAll(); + this.resetAll(e); } } } diff --git a/packages/vchart/src/interaction/triggers/element-select.ts b/packages/vchart/src/interaction/triggers/element-select.ts index 9b63b005db..b13b3acfe1 100644 --- a/packages/vchart/src/interaction/triggers/element-select.ts +++ b/packages/vchart/src/interaction/triggers/element-select.ts @@ -61,21 +61,21 @@ export class ElementSelect extends BaseTrigger implements return events; } - resetAll = () => { + resetAll = (e?: BaseEventParams) => { const { state, reverseState, interaction } = this.options; const statedGraphics = interaction.getStatedGraphics(this); if (statedGraphics && statedGraphics.length) { interaction.clearAllStatesOfTrigger(this, state, reverseState); - this.dispatchEvent('reset', { graphics: statedGraphics, options: this.options }); + this.dispatchEvent('reset', { graphics: statedGraphics, options: this.options, ...e }); interaction.setStatedGraphics(this, []); } }; handleStart = (e: BaseEventParams) => { - this.start(e.item); + this.start(e.item, e); }; handleReset = (e: BaseEventParams) => { @@ -89,13 +89,13 @@ export class ElementSelect extends BaseTrigger implements const hasActiveElement = markGraphic && this._markSet.getMarkInId(markGraphic.context.markId); if (this._resetType.includes('view') && !hasActiveElement) { - this.resetAll(); + this.resetAll(e); } else if (this._resetType.includes('self') && hasActiveElement) { - this.resetAll(); + this.resetAll(e); } }; - start(markGraphic: IMarkGraphic) { + start(markGraphic: IMarkGraphic, e?: BaseEventParams) { const { state, reverseState, isMultiple, interaction } = this.options; const statedGraphics = interaction.getStatedGraphics(this); @@ -110,7 +110,7 @@ export class ElementSelect extends BaseTrigger implements interaction.updateStates(this, newStatedGraphics, statedGraphics, state, reverseState) ); } else { - this.resetAll(); + this.resetAll(e); } } } else { @@ -127,26 +127,26 @@ export class ElementSelect extends BaseTrigger implements reverseState ); interaction.setStatedGraphics(this, newStatedGraphics); - this.dispatchEvent('start', { graphics: newStatedGraphics, options: this.options }); + this.dispatchEvent('start', { graphics: newStatedGraphics, options: this.options, ...e }); if (this._resetType.includes('timeout')) { this._timer = setTimeout(() => { - this.resetAll(); + this.resetAll(e); }, this.options.triggerOff as number) as unknown as number; } } } else if (this._resetType.includes('view') && statedGraphics && statedGraphics.length) { - this.resetAll(); + this.resetAll(e); } } - reset(markGraphic: IMarkGraphic) { + reset(markGraphic: IMarkGraphic, e?: BaseEventParams) { if (markGraphic) { if (this._markSet.getMarkInId(markGraphic.context.markId)) { markGraphic.removeState([this.options.state, this.options.reverseState]); } } else { - this.resetAll(); + this.resetAll(e); } } }