@visactor/vgrammar-core 0.7.7 → 0.8.0

package/es/interactions/dimension-tooltip.js

@@ -0,0 +1,99 @@
+import { AABBBounds, array, getAngleByPoint, isString, throttle } from "@visactor/vutils";
+
+import { BaseTooltip } from "./base-tooltip";
+
+import { generateTooltipAttributes } from "./base-tooltip";
+
+import { BridgeElementKey } from "../graph/constants";
+
+import { invokeFunctionType } from "../parse/util";
+
+const isEqualTooltipDatum = (current, previous) => {
+    const currentDatum = array(current), previousDatum = array(previous);
+    return currentDatum.length === previousDatum.length && (currentDatum.every((datum => previousDatum.includes(datum))) && previousDatum.every((datum => currentDatum.includes(datum))));
+}, computeTooltipFilterValue = (point, scale, type, groupSize, tooltipCenter) => {
+    if ("x" === type) return scale.invert(point.x);
+    if ("y" === type) return scale.invert(point.y);
+    if ("radius" === type) {
+        const center = null != tooltipCenter ? tooltipCenter : {
+            x: groupSize.width / 2,
+            y: groupSize.height / 2
+        }, radius = Math.sqrt((center.x - point.x) ** 2 + (center.y - point.y) ** 2);
+        return scale.invert(radius);
+    }
+    if ("angle" === type) {
+        const center = null != tooltipCenter ? tooltipCenter : {
+            x: groupSize.width / 2,
+            y: groupSize.height / 2
+        }, angle = getAngleByPoint(center, point);
+        return scale.invert(angle < 0 ? angle + 2 * Math.PI : angle);
+    }
+    return scale.invert(point.x);
+};
+
+export class DimensionTooltip extends BaseTooltip {
+    constructor(view, options) {
+        var _a, _b, _c;
+        super(view, options), this.type = DimensionTooltip.type, this._avoidMarks = [], 
+        this._tooltipDataFilter = null, this.handleTooltipShow = throttle((event => {
+            var _a, _b, _c;
+            const scale = (isString(this.options.scale) ? this.view.getScaleById(this.options.scale) : this.options.scale).getScale(), groupGraphicItem = this._container.getGroupGraphicItem(), point = {
+                x: 0,
+                y: 0
+            };
+            groupGraphicItem.globalTransMatrix.transformPoint(event.canvas, point);
+            const groupSize = {
+                width: groupGraphicItem.attribute.width,
+                height: groupGraphicItem.attribute.height
+            };
+            if (point.x < 0 || point.x > groupGraphicItem.attribute.width || point.y < 0 || point.y > groupGraphicItem.attribute.height) return void this._tooltipComponent.hideAll();
+            const eventTargetMark = null === (_b = null === (_a = event.target) || void 0 === _a ? void 0 : _a[BridgeElementKey]) || void 0 === _b ? void 0 : _b.mark;
+            if (this._avoidMarks.includes(eventTargetMark)) return void this._tooltipComponent.hideAll();
+            const target = null === (_c = this.options.target) || void 0 === _c ? void 0 : _c.data, lastDataGrammar = target ? isString(target) ? this.view.getDataById(target) : target : null, data = lastDataGrammar ? lastDataGrammar.getValue() : [], filterValue = computeTooltipFilterValue(point, scale, this.options.tooltipType, groupSize, this.options.center), tooltipDatum = this._tooltipDataFilter ? data.filter((datum => this._tooltipDataFilter(datum, filterValue))) : [];
+            if (this._tooltipComponent.showAll(), isEqualTooltipDatum(tooltipDatum, this._lastDatum)) return void this._tooltipComponent.setAttributes({
+                pointerX: point.x,
+                pointerY: point.y
+            });
+            this._lastDatum = tooltipDatum;
+            const boundsStart = {
+                x: 0,
+                y: 0
+            };
+            groupGraphicItem.globalTransMatrix.transformPoint({
+                x: 0,
+                y: 0
+            }, boundsStart);
+            const boundsEnd = {
+                x: 0,
+                y: 0
+            };
+            groupGraphicItem.globalTransMatrix.transformPoint({
+                x: this.view.getSignalById("width").getValue(),
+                y: this.view.getSignalById("height").getValue()
+            }, boundsEnd);
+            const bounds = (new AABBBounds).set(boundsStart.x, boundsStart.y, boundsEnd.x, boundsEnd.y), {title: title, content: content} = this._computeTitleContent(tooltipDatum), theme = this.view.getCurrentTheme(), addition = invokeFunctionType(this.options.attributes, this.parameters(), {}), attributes = generateTooltipAttributes(point, title, content, bounds, theme, addition);
+            this._tooltipComponent.setAttributes(attributes);
+        }), 10), this.handleTooltipHide = event => {
+            this._tooltipComponent.hideAll();
+        }, this.options = Object.assign({}, DimensionTooltip.defaultOptions, options), this._marks = view.getMarksBySelector(this.options.selector), 
+        this._avoidMarks = null !== (_a = view.getMarksBySelector(this.options.avoidMark)) && void 0 !== _a ? _a : [], 
+        this._container = null !== (_c = null === (_b = view.getMarksBySelector(this.options.container)) || void 0 === _b ? void 0 : _b[0]) && void 0 !== _c ? _c : view.rootMark;
+    }
+    getEvents() {
+        const filter = this.options.target.filter;
+        return this._tooltipDataFilter = isString(filter) ? (datum, filterValue) => filterValue === datum[filter] : filter, 
+        [ {
+            type: this.options.trigger,
+            handler: this.handleTooltipShow
+        }, {
+            type: this.options.resetTrigger,
+            handler: this.handleTooltipHide
+        } ];
+    }
+}
+
+DimensionTooltip.type = "dimension-tooltip", DimensionTooltip.defaultOptions = {
+    trigger: "pointermove",
+    resetTrigger: "pointerleave"
+};
+//# sourceMappingURL=dimension-tooltip.js.map

package/es/interactions/dimension-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/dimension-tooltip.ts"],"names":[],"mappings":"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","file":"dimension-tooltip.js","sourcesContent":["import type { IPointLike } from '@visactor/vutils';\n// eslint-disable-next-line no-duplicate-imports\nimport { AABBBounds, array, getAngleByPoint, isString, throttle } from '@visactor/vutils';\nimport type { DimensionTooltipOptions, IGroupMark, IMark, IView, TooltipType } from '../types';\nimport { BaseTooltip } from './base-tooltip';\n// eslint-disable-next-line no-duplicate-imports\nimport { generateTooltipAttributes } from './base-tooltip';\nimport { BridgeElementKey } from '../graph/constants';\nimport type { IBaseScale } from '@visactor/vscale';\nimport { invokeFunctionType } from '../parse/util';\n\nconst isEqualTooltipDatum = (current: any[], previous: any[]) => {\n  const currentDatum = array(current);\n  const previousDatum = array(previous);\n  if (currentDatum.length !== previousDatum.length) {\n    return false;\n  }\n  return (\n    currentDatum.every(datum => previousDatum.includes(datum)) &&\n    previousDatum.every(datum => currentDatum.includes(datum))\n  );\n};\n\nconst computeTooltipFilterValue = (\n  point: IPointLike,\n  scale: IBaseScale,\n  type: TooltipType,\n  groupSize: { width: number; height: number },\n  tooltipCenter?: IPointLike\n) => {\n  if (type === 'x') {\n    return scale.invert(point.x);\n  }\n  if (type === 'y') {\n    return scale.invert(point.y);\n  }\n  if (type === 'radius') {\n    const center = tooltipCenter ?? { x: groupSize.width / 2, y: groupSize.height / 2 };\n    const radius = Math.sqrt((center.x - point.x) ** 2 + (center.y - point.y) ** 2);\n    return scale.invert(radius);\n  }\n  if (type === 'angle') {\n    const center = tooltipCenter ?? { x: groupSize.width / 2, y: groupSize.height / 2 };\n    const angle = getAngleByPoint(center, point);\n    return scale.invert(angle < 0 ? angle + Math.PI * 2 : angle);\n  }\n  return scale.invert(point.x);\n};\n\nexport class DimensionTooltip extends BaseTooltip<DimensionTooltipOptions> {\n  static type: string = 'dimension-tooltip';\n  type: string = DimensionTooltip.type;\n\n  static defaultOptions: Omit<DimensionTooltipOptions, 'target'> = {\n    trigger: 'pointermove',\n    resetTrigger: 'pointerleave'\n  };\n  protected _avoidMarks: IMark[] = [];\n  protected _lastDatum: any;\n  protected _tooltipDataFilter: ((datum: any, filterValue: any[]) => boolean) | null = null;\n  protected _container: IGroupMark;\n\n  constructor(view: IView, options?: DimensionTooltipOptions) {\n    super(view, options);\n    this.options = Object.assign({}, DimensionTooltip.defaultOptions, options);\n    this._marks = view.getMarksBySelector(this.options.selector);\n    this._avoidMarks = view.getMarksBySelector(this.options.avoidMark) ?? [];\n    this._container = (view.getMarksBySelector(this.options.container)?.[0] as IGroupMark) ?? view.rootMark;\n  }\n\n  protected getEvents() {\n    const filter = this.options.target.filter;\n\n    this._tooltipDataFilter = isString(filter)\n      ? (datum: any, filterValue: any[]) => filterValue === datum[filter]\n      : filter;\n\n    return [\n      { type: this.options.trigger, handler: this.handleTooltipShow },\n      { type: this.options.resetTrigger, handler: this.handleTooltipHide }\n    ];\n  }\n\n  protected handleTooltipShow = throttle((event: any) => {\n    const scaleGrammar = isString(this.options.scale) ? this.view.getScaleById(this.options.scale) : this.options.scale;\n    const scale = scaleGrammar.getScale();\n    const groupGraphicItem = this._container.getGroupGraphicItem();\n    // FIXME: waiting for vRender to add transformed position to event\n    const point = { x: 0, y: 0 };\n    groupGraphicItem.globalTransMatrix.transformPoint(event.canvas, point);\n    const groupSize = { width: groupGraphicItem.attribute.width, height: groupGraphicItem.attribute.height };\n\n    // if pointer is not within the area of group, hide tooltip\n    if (\n      point.x < 0 ||\n      point.x > groupGraphicItem.attribute.width ||\n      point.y < 0 ||\n      point.y > groupGraphicItem.attribute.height\n    ) {\n      this._tooltipComponent.hideAll();\n      return;\n    }\n    // if pointer is hovered on the avoided marks, hide tooltip\n    const eventTargetMark = event.target?.[BridgeElementKey]?.mark;\n    if (this._avoidMarks.includes(eventTargetMark)) {\n      this._tooltipComponent.hideAll();\n      return;\n    }\n\n    const target = this.options.target?.data;\n    const lastDataGrammar = !target ? null : isString(target) ? this.view.getDataById(target) : target;\n    const data = lastDataGrammar ? lastDataGrammar.getValue() : [];\n\n    const filterValue = computeTooltipFilterValue(\n      point,\n      scale,\n      this.options.tooltipType,\n      groupSize,\n      this.options.center\n    );\n    const tooltipDatum = this._tooltipDataFilter\n      ? data.filter(datum => this._tooltipDataFilter(datum, filterValue))\n      : [];\n\n    this._tooltipComponent.showAll();\n    if (isEqualTooltipDatum(tooltipDatum, this._lastDatum)) {\n      // only update pointer when element is not changed\n      this._tooltipComponent.setAttributes({ pointerX: point.x, pointerY: point.y } as any);\n      return;\n    }\n    this._lastDatum = tooltipDatum;\n\n    // compute tooltip bounds\n    const boundsStart = { x: 0, y: 0 };\n    groupGraphicItem.globalTransMatrix.transformPoint({ x: 0, y: 0 }, boundsStart);\n    const boundsEnd = { x: 0, y: 0 };\n    groupGraphicItem.globalTransMatrix.transformPoint(\n      {\n        x: this.view.getSignalById('width').getValue() as number,\n        y: this.view.getSignalById('height').getValue() as number\n      },\n      boundsEnd\n    );\n    const bounds = new AABBBounds().set(boundsStart.x, boundsStart.y, boundsEnd.x, boundsEnd.y);\n    const { title, content } = this._computeTitleContent(tooltipDatum);\n    const theme = this.view.getCurrentTheme();\n    const addition = invokeFunctionType(this.options.attributes, this.parameters(), {}) as any;\n    const attributes = generateTooltipAttributes(point, title, content, bounds, theme, addition);\n    this._tooltipComponent.setAttributes(attributes);\n  }, 10);\n\n  protected handleTooltipHide = (event: any) => {\n    this._tooltipComponent.hideAll();\n  };\n}\n"]}

package/es/interactions/drill-down.d.ts

@@ -0,0 +1,25 @@
+import type { IPolygon } from '@visactor/vrender-core';
+import type { DrillDownOptions, IView, InteractionEvent } from '../types';
+import { BrushBase } from './brush-base';
+import { type IBounds } from '@visactor/vutils';
+import type { FilterMixin } from './filter';
+export interface DrillDown extends Pick<FilterMixin, '_data' | '_filterValue' | '_dataFilter' | 'handleFilter' | '_filterData'>, BrushBase<DrillDownOptions> {
+}
+export declare class DrillDown extends BrushBase<DrillDownOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: Omit<DrillDownOptions, 'target'>;
+    constructor(view: IView, option?: DrillDownOptions);
+    protected getEvents(): {
+        type: string;
+        handler: import("../types").InteractionEventHandler;
+    }[];
+    handleBrushUpdate: (options: {
+        operateType: string;
+        operateMask: IPolygon;
+        operatedMaskAABBBounds: {
+            [name: string]: IBounds;
+        };
+    }) => void;
+    handleTrigger: (event: InteractionEvent) => void;
+}

package/es/interactions/drill-down.js

@@ -0,0 +1,46 @@
+import { BrushBase } from "./brush-base";
+
+import { isString, array } from "@visactor/vutils";
+
+import { DataFilterRank } from "../graph";
+
+export class DrillDown extends BrushBase {
+    constructor(view, option) {
+        super(view, Object.assign({}, DrillDown.defaultOptions, option)), this.type = DrillDown.type, 
+        this.handleBrushUpdate = options => {
+            const elements = [];
+            let filterValue = [];
+            this._marks.forEach((mark => {
+                mark.elements.forEach((el => {
+                    this.isBrushContainGraphicItem(options.operateMask, el.getGraphicItem()) && (elements.push(el), 
+                    filterValue = filterValue.concat(array(el.getDatum())));
+                }));
+            })), this._data && (filterValue = Array.from(new Set(filterValue)), this._filterValue && filterValue.length === this._filterValue.length && !filterValue.some((datum => !this._filterValue.includes(datum))) || (this._filterValue = filterValue, 
+            this.handleFilter())), this.dispatchEvent(options, elements);
+        }, this.handleTrigger = event => {
+            const element = event.element;
+            if (element && this._marks && this._marks.includes(element.mark)) {
+                const filterValue = array(element.getDatum());
+                this._filterValue && filterValue.length === this._filterValue.length && !filterValue.some((datum => !this._filterValue.includes(datum))) || (this._filterValue = filterValue, 
+                this.handleFilter());
+            }
+        }, this._data = isString(this.options.target.data) ? view.getDataById(this.options.target.data) : this.options.target.data;
+    }
+    getEvents() {
+        if (!this._data) return [];
+        const transform = this.options.target.transform;
+        return this._filterData(this._data, null, DataFilterRank.drillDown, null, void 0, ((data, filterValue) => {
+            const nextData = filterValue || data;
+            return transform ? transform(data, filterValue) : nextData;
+        })), this.options.brush ? super.getEvents() : [ {
+            type: this.options.trigger,
+            handler: this.handleTrigger
+        } ];
+    }
+}
+
+DrillDown.type = "drill-down", DrillDown.defaultOptions = {
+    brush: !1,
+    trigger: "click"
+};
+//# sourceMappingURL=drill-down.js.map

package/es/interactions/drill-down.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/drill-down.ts"],"names":[],"mappings":"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","file":"drill-down.js","sourcesContent":["import type { IPolygon } from '@visactor/vrender-core';\nimport type { DrillDownOptions, IElement, IGlyphElement, IView, InteractionEvent } from '../types';\nimport { BrushBase } from './brush-base';\nimport { isString, type IBounds, array } from '@visactor/vutils';\nimport { DataFilterRank } from '../graph';\nimport type { FilterMixin } from './filter';\n\nexport interface DrillDown\n  extends Pick<FilterMixin, '_data' | '_filterValue' | '_dataFilter' | 'handleFilter' | '_filterData'>,\n    BrushBase<DrillDownOptions> {}\n\nexport class DrillDown extends BrushBase<DrillDownOptions> {\n  static type: string = 'drill-down';\n  type: string = DrillDown.type;\n\n  static defaultOptions: Omit<DrillDownOptions, 'target'> = {\n    brush: false,\n    trigger: 'click'\n  };\n\n  constructor(view: IView, option?: DrillDownOptions) {\n    super(view, Object.assign({}, DrillDown.defaultOptions, option));\n    this._data = isString(this.options.target.data)\n      ? view.getDataById(this.options.target.data)\n      : this.options.target.data;\n  }\n\n  protected getEvents() {\n    if (!this._data) {\n      return [];\n    }\n\n    const transform = this.options.target.transform;\n    const dataTransform = (data: any[], filterValue: any) => {\n      const nextData = !filterValue ? data : filterValue;\n      return transform ? transform(data, filterValue) : nextData;\n    };\n\n    this._filterData(this._data, null, DataFilterRank.drillDown, null, undefined, dataTransform);\n\n    if (this.options.brush) {\n      return super.getEvents();\n    }\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleTrigger\n      }\n    ];\n  }\n\n  handleBrushUpdate = (options: {\n    operateType: string;\n    operateMask: IPolygon;\n    operatedMaskAABBBounds: { [name: string]: IBounds };\n  }) => {\n    const elements: (IElement | IGlyphElement)[] = [];\n\n    let filterValue: any[] = [];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isActive = this.isBrushContainGraphicItem(options.operateMask, el.getGraphicItem());\n\n        if (isActive) {\n          elements.push(el);\n          filterValue = filterValue.concat(array(el.getDatum()));\n        }\n      });\n    });\n\n    if (this._data) {\n      // remove repeated datum\n      filterValue = Array.from(new Set(filterValue));\n\n      // shallow compare\n      if (\n        !this._filterValue ||\n        filterValue.length !== this._filterValue.length ||\n        filterValue.some(datum => !this._filterValue.includes(datum))\n      ) {\n        this._filterValue = filterValue;\n        this.handleFilter();\n      }\n    }\n\n    this.dispatchEvent(options, elements);\n  };\n\n  handleTrigger = (event: InteractionEvent) => {\n    const element = event.element;\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const filterValue = array(element.getDatum());\n      // shallow compare\n      if (\n        !this._filterValue ||\n        filterValue.length !== this._filterValue.length ||\n        filterValue.some(datum => !this._filterValue.includes(datum))\n      ) {\n        this._filterValue = filterValue;\n        this.handleFilter();\n      }\n    }\n  };\n}\n"]}

package/es/interactions/element-active-by-legend.d.ts

@@ -0,0 +1,17 @@
+import type { ElementActiveByLegendOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+import { LegendEvent } from '@visactor/vrender-components';
+export declare class ElementActiveByLegend extends BaseInteraction<ElementActiveByLegendOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementActiveByLegendOptions;
+    options: ElementActiveByLegendOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementActiveByLegendOptions);
+    protected getEvents(): {
+        type: LegendEvent;
+        handler: (e: InteractionEvent, element: IGlyphElement<any> | IElement) => void;
+    }[];
+    handleStart: (e: InteractionEvent, element: IElement | IGlyphElement) => void;
+    handleReset: (e: InteractionEvent) => void;
+}

package/es/interactions/element-active-by-legend.js

@@ -0,0 +1,43 @@
+import { InteractionStateEnum } from "../graph/enums";
+
+import { BaseInteraction } from "./base";
+
+import { LegendEvent } from "@visactor/vrender-components";
+
+import { isNil } from "@visactor/vutils";
+
+export class ElementActiveByLegend extends BaseInteraction {
+    constructor(view, options) {
+        super(view, options), this.type = ElementActiveByLegend.type, this.handleStart = (e, element) => {
+            var _a, _b;
+            const itemKey = null === (_b = null === (_a = e.detail) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b.id;
+            isNil(itemKey) || this._marks.forEach((mark => {
+                mark.elements.forEach((el => {
+                    el[this.options.filterType] === itemKey ? el.addState(this.options.state) : el.removeState(this.options.state);
+                }));
+            }));
+        }, this.handleReset = e => {
+            this._marks.forEach((mark => {
+                mark.elements.forEach((el => {
+                    el.hasState(this.options.state) && el.removeState(this.options.state);
+                }));
+            }));
+        }, this.options = Object.assign({}, ElementActiveByLegend.defaultOptions, options), 
+        this._marks = view.getMarksBySelector(this.options.selector);
+    }
+    getEvents() {
+        return [ {
+            type: LegendEvent.legendItemHover,
+            handler: this.handleStart
+        }, {
+            type: LegendEvent.legendItemUnHover,
+            handler: this.handleReset
+        } ];
+    }
+}
+
+ElementActiveByLegend.type = "element-active-by-legend", ElementActiveByLegend.defaultOptions = {
+    state: InteractionStateEnum.active,
+    filterType: "groupKey"
+};
+//# sourceMappingURL=element-active-by-legend.js.map

package/es/interactions/element-active-by-legend.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-active-by-legend.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAEzC,MAAM,OAAO,qBAAsB,SAAQ,eAA6C;IAWtF,YAAY,IAAW,EAAE,OAAsC;QAC7D,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAVvB,SAAI,GAAW,qBAAqB,CAAC,IAAI,CAAC;QA6B1C,gBAAW,GAAG,CAAC,CAAmB,EAAE,OAAiC,EAAE,EAAE;;YACvE,MAAM,OAAO,GAAG,MAAA,MAAA,CAAC,CAAC,MAAM,0CAAE,IAAI,0CAAE,EAAE,CAAC;YAEnC,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE;gBAClB,OAAO;aACR;YAED,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;oBACzB,MAAM,QAAQ,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,OAAO,CAAC;oBAEzD,IAAI,QAAQ,EAAE;wBACZ,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;qBACjC;yBAAM;wBACL,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;qBACpC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;oBACzB,IAAI,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;wBACnC,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;qBACpC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QA9CA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,qBAAqB,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QAEhF,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAES,SAAS;QACjB,OAAO;YACL;gBACE,IAAI,EAAE,WAAW,CAAC,eAAe;gBACjC,OAAO,EAAE,IAAI,CAAC,WAAW;aAC1B;YACD;gBACE,IAAI,EAAE,WAAW,CAAC,iBAAiB;gBACnC,OAAO,EAAE,IAAI,CAAC,WAAW;aAC1B;SACF,CAAC;IACJ,CAAC;;AA5BM,0BAAI,GAAW,0BAA0B,CAAC;AAG1C,oCAAc,GAAiC;IACpD,KAAK,EAAE,oBAAoB,CAAC,MAAM;IAClC,UAAU,EAAE,UAAU;CACvB,CAAC","file":"element-active-by-legend.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementActiveByLegendOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { LegendEvent } from '@visactor/vrender-components';\nimport { isNil } from '@visactor/vutils';\n\nexport class ElementActiveByLegend extends BaseInteraction<ElementActiveByLegendOptions> {\n  static type: string = 'element-active-by-legend';\n  type: string = ElementActiveByLegend.type;\n\n  static defaultOptions: ElementActiveByLegendOptions = {\n    state: InteractionStateEnum.active,\n    filterType: 'groupKey'\n  };\n  options: ElementActiveByLegendOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementActiveByLegendOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementActiveByLegend.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: LegendEvent.legendItemHover,\n        handler: this.handleStart\n      },\n      {\n        type: LegendEvent.legendItemUnHover,\n        handler: this.handleReset\n      }\n    ];\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const itemKey = e.detail?.data?.id;\n\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isActive = el[this.options.filterType] === itemKey;\n\n        if (isActive) {\n          el.addState(this.options.state);\n        } else {\n          el.removeState(this.options.state);\n        }\n      });\n    });\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        if (el.hasState(this.options.state)) {\n          el.removeState(this.options.state);\n        }\n      });\n    });\n  };\n}\n"]}

package/es/interactions/element-active.d.ts

@@ -0,0 +1,16 @@
+import type { ElementActiveOptions, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+export declare class ElementActive extends BaseInteraction<ElementActiveOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementActiveOptions;
+    options: ElementActiveOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementActiveOptions);
+    protected getEvents(): {
+        type: import("../types").EventType;
+        handler: (e: InteractionEvent) => void;
+    }[];
+    handleStart: (e: InteractionEvent) => void;
+    handleReset: (e: InteractionEvent) => void;
+}

package/es/interactions/element-active.js

@@ -0,0 +1,29 @@
+import { InteractionStateEnum } from "../graph/enums";
+
+import { BaseInteraction } from "./base";
+
+export class ElementActive extends BaseInteraction {
+    constructor(view, options) {
+        super(view, options), this.type = ElementActive.type, this.handleStart = e => {
+            e.element && this._marks && this._marks.includes(e.element.mark) && e.element.addState(this.options.state);
+        }, this.handleReset = e => {
+            e.element && this._marks && this._marks.includes(e.element.mark) && e.element.removeState(this.options.state);
+        }, this.options = Object.assign({}, ElementActive.defaultOptions, options), this._marks = view.getMarksBySelector(this.options.selector);
+    }
+    getEvents() {
+        return [ {
+            type: this.options.trigger,
+            handler: this.handleStart
+        }, {
+            type: this.options.resetTrigger,
+            handler: this.handleReset
+        } ];
+    }
+}
+
+ElementActive.type = "element-active", ElementActive.defaultOptions = {
+    state: InteractionStateEnum.active,
+    trigger: "pointerover",
+    resetTrigger: "pointerout"
+};
+//# sourceMappingURL=element-active.js.map

package/es/interactions/element-active.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-active.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAEzC,MAAM,OAAO,aAAc,SAAQ,eAAqC;IAYtE,YAAY,IAAW,EAAE,OAA8B;QACrD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAXvB,SAAI,GAAW,aAAa,CAAC,IAAI,CAAC;QA2BlC,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,CAAC,OAAO,EAAE;gBACb,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;oBACvD,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;iBACxC;aACF;QACH,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,CAAC,OAAO,EAAE;gBACb,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;oBACvD,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;iBAC3C;aACF;QACH,CAAC,CAAC;QA7BA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,aAAa,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QAExE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAES,SAAS;QACjB,OAAO;YACL;gBACE,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,OAAO;gBAC1B,OAAO,EAAE,IAAI,CAAC,WAAW;aAC1B;YACD,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;SAC/D,CAAC;IACJ,CAAC;;AA1BM,kBAAI,GAAW,gBAAgB,CAAC;AAGhC,4BAAc,GAAyB;IAC5C,KAAK,EAAE,oBAAoB,CAAC,MAAM;IAClC,OAAO,EAAE,aAAa;IACtB,YAAY,EAAE,YAAY;CAC3B,CAAC","file":"element-active.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementActiveOptions, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\n\nexport class ElementActive extends BaseInteraction<ElementActiveOptions> {\n  static type: string = 'element-active';\n  type: string = ElementActive.type;\n\n  static defaultOptions: ElementActiveOptions = {\n    state: InteractionStateEnum.active,\n    trigger: 'pointerover',\n    resetTrigger: 'pointerout'\n  };\n  options: ElementActiveOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementActiveOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementActive.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.resetTrigger, handler: this.handleReset }\n    ];\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    if (e.element) {\n      if (this._marks && this._marks.includes(e.element.mark)) {\n        e.element.addState(this.options.state);\n      }\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    if (e.element) {\n      if (this._marks && this._marks.includes(e.element.mark)) {\n        e.element.removeState(this.options.state);\n      }\n    }\n  };\n}\n"]}

package/es/interactions/element-highlight-by-group.d.ts

@@ -0,0 +1,17 @@
+import type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+export declare class ElementHighlightByGroup extends BaseInteraction<ElementHighlightOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementHighlightOptions;
+    options: ElementHighlightOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementHighlightOptions);
+    protected getEvents(): {
+        type: import("../types").EventType;
+        handler: (e: InteractionEvent) => void;
+    }[];
+    clearPrevElements(): void;
+    handleStart: (e: InteractionEvent) => void;
+    handleReset: (e: InteractionEvent) => void;
+}

package/es/interactions/element-highlight-by-group.js

@@ -0,0 +1,49 @@
+import { isNil } from "@visactor/vutils";
+
+import { BaseInteraction } from "./base";
+
+import { InteractionStateEnum } from "../graph/enums";
+
+export class ElementHighlightByGroup extends BaseInteraction {
+    constructor(view, options) {
+        super(view, options), this.type = ElementHighlightByGroup.type, this.handleStart = e => {
+            if (e.element && this._marks && this._marks.includes(e.element.mark)) {
+                const highlightKey = e.element.groupKey;
+                if (isNil(highlightKey)) return;
+                this._marks.forEach((mark => {
+                    mark.elements.forEach((el => {
+                        el.groupKey === highlightKey ? (el.removeState(this.options.blurState), el.addState(this.options.highlightState)) : (el.removeState(this.options.highlightState), 
+                        el.addState(this.options.blurState));
+                    }));
+                }));
+            }
+        }, this.handleReset = e => {
+            e.element && this._marks && this._marks.includes(e.element.mark) && this.clearPrevElements();
+        }, this.options = Object.assign({}, ElementHighlightByGroup.defaultOptions, options), 
+        this._marks = view.getMarksBySelector(this.options.selector);
+    }
+    getEvents() {
+        return [ {
+            type: this.options.trigger,
+            handler: this.handleStart
+        }, {
+            type: this.options.resetTrigger,
+            handler: this.handleReset
+        } ];
+    }
+    clearPrevElements() {
+        this._marks.forEach((mark => {
+            mark.elements.forEach((el => {
+                el.hasState(this.options.highlightState) && el.removeState(this.options.highlightState), 
+                el.hasState(this.options.blurState) && el.removeState(this.options.blurState);
+            }));
+        }));
+    }
+}
+
+ElementHighlightByGroup.type = "element-highlight-by-group", ElementHighlightByGroup.defaultOptions = {
+    highlightState: InteractionStateEnum.highlight,
+    blurState: InteractionStateEnum.blur,
+    trigger: "pointerover",
+    resetTrigger: "pointerout"
+};

package/es/interactions/element-highlight-by-group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-highlight-by-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAEzC,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,MAAM,OAAO,uBAAwB,SAAQ,eAAwC;IAanF,YAAY,IAAW,EAAE,OAAiC;QACxD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAZvB,SAAI,GAAW,uBAAuB,CAAC,IAAI,CAAC;QA0C5C,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACpE,MAAM,YAAY,GAAG,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC;gBAExC,IAAI,KAAK,CAAC,YAAY,CAAC,EAAE;oBACvB,OAAO;iBACR;gBACD,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;oBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;wBACzB,MAAM,WAAW,GAAG,EAAE,CAAC,QAAQ,KAAK,YAAY,CAAC;wBAEjD,IAAI,WAAW,EAAE;4BACf,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;4BACvC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;yBAC1C;6BAAM;4BACL,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;4BAC5C,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;yBACrC;oBACH,CAAC,CAAC,CAAC;gBACL,CAAC,CAAC,CAAC;aACJ;QACH,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,MAAM,gBAAgB,GAAG,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YAE1F,IAAI,gBAAgB,EAAE;gBACpB,IAAI,CAAC,iBAAiB,EAAE,CAAC;aAC1B;QACH,CAAC,CAAC;QA1DA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,uBAAuB,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QAElF,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAES,SAAS;QACjB,OAAO;YACL;gBACE,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,OAAO;gBAC1B,OAAO,EAAE,IAAI,CAAC,WAAW;aAC1B;YACD,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;SAC/D,CAAC;IACJ,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBACzB,IAAI,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE;oBAC5C,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;iBAC7C;gBAED,IAAI,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;oBACvC,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;iBACxC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;;AAzCM,4BAAI,GAAW,4BAA4B,CAAC;AAG5C,sCAAc,GAA4B;IAC/C,cAAc,EAAE,oBAAoB,CAAC,SAAS;IAC9C,SAAS,EAAE,oBAAoB,CAAC,IAAI;IACpC,OAAO,EAAE,aAAa;IACtB,YAAY,EAAE,YAAY;CAC3B,CAAC","file":"element-highlight-by-group.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { InteractionStateEnum } from '../graph/enums';\n\nexport class ElementHighlightByGroup extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-group';\n  type: string = ElementHighlightByGroup.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    resetTrigger: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByGroup.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.resetTrigger, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        if (el.hasState(this.options.highlightState)) {\n          el.removeState(this.options.highlightState);\n        }\n\n        if (el.hasState(this.options.blurState)) {\n          el.removeState(this.options.blurState);\n        }\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    if (e.element && this._marks && this._marks.includes(e.element.mark)) {\n      const highlightKey = e.element.groupKey;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.groupKey === highlightKey;\n\n          if (isHighlight) {\n            el.removeState(this.options.blurState);\n            el.addState(this.options.highlightState);\n          } else {\n            el.removeState(this.options.highlightState);\n            el.addState(this.options.blurState);\n          }\n        });\n      });\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const hasActiveElement = e.element && this._marks && this._marks.includes(e.element.mark);\n\n    if (hasActiveElement) {\n      this.clearPrevElements();\n    }\n  };\n}\n"]}

package/es/interactions/element-highlight-by-key.d.ts

@@ -0,0 +1,17 @@
+import type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+export declare class ElementHighlightByKey extends BaseInteraction<ElementHighlightOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementHighlightOptions;
+    options: ElementHighlightOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementHighlightOptions);
+    protected getEvents(): {
+        type: import("../types").EventType;
+        handler: (e: InteractionEvent) => void;
+    }[];
+    clearPrevElements(): void;
+    handleStart: (e: InteractionEvent) => void;
+    handleReset: (e: InteractionEvent) => void;
+}

package/es/interactions/element-highlight-by-key.js

@@ -0,0 +1,50 @@
+import { isNil } from "@visactor/vutils";
+
+import { BaseInteraction } from "./base";
+
+import { InteractionStateEnum } from "../graph/enums";
+
+export class ElementHighlightByKey extends BaseInteraction {
+    constructor(view, options) {
+        super(view, options), this.type = ElementHighlightByKey.type, this.handleStart = e => {
+            if (e.element && this._marks && this._marks.includes(e.element.mark)) {
+                const highlightKey = e.element.key;
+                if (isNil(highlightKey)) return;
+                this._marks.forEach((mark => {
+                    mark.elements.forEach((el => {
+                        el.key === highlightKey ? (el.removeState(this.options.blurState), el.addState(this.options.highlightState)) : (el.removeState(this.options.highlightState), 
+                        el.addState(this.options.blurState));
+                    }));
+                }));
+            }
+        }, this.handleReset = e => {
+            e.element && this._marks && this._marks.includes(e.element.mark) && this.clearPrevElements();
+        }, this.options = Object.assign({}, ElementHighlightByKey.defaultOptions, options), 
+        this._marks = view.getMarksBySelector(this.options.selector);
+    }
+    getEvents() {
+        return [ {
+            type: this.options.trigger,
+            handler: this.handleStart
+        }, {
+            type: this.options.resetTrigger,
+            handler: this.handleReset
+        } ];
+    }
+    clearPrevElements() {
+        this._marks.forEach((mark => {
+            mark.elements.forEach((el => {
+                el.hasState(this.options.highlightState) && el.removeState(this.options.highlightState), 
+                el.hasState(this.options.blurState) && el.removeState(this.options.blurState);
+            }));
+        }));
+    }
+}
+
+ElementHighlightByKey.type = "element-highlight-by-key", ElementHighlightByKey.defaultOptions = {
+    highlightState: InteractionStateEnum.highlight,
+    blurState: InteractionStateEnum.blur,
+    trigger: "pointerover",
+    resetTrigger: "pointerout"
+};
+//# sourceMappingURL=element-highlight-by-key.js.map

package/es/interactions/element-highlight-by-key.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-highlight-by-key.ts"],"names":[],"mappings":"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","file":"element-highlight-by-key.js","sourcesContent":["import { isNil } from '@visactor/vutils';\nimport type { ElementHighlightOptions, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { InteractionStateEnum } from '../graph/enums';\n\nexport class ElementHighlightByKey extends BaseInteraction<ElementHighlightOptions> {\n  static type: string = 'element-highlight-by-key';\n  type: string = ElementHighlightByKey.type;\n\n  static defaultOptions: ElementHighlightOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    trigger: 'pointerover',\n    resetTrigger: 'pointerout'\n  };\n  options: ElementHighlightOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByKey.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.resetTrigger, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        if (el.hasState(this.options.highlightState)) {\n          el.removeState(this.options.highlightState);\n        }\n\n        if (el.hasState(this.options.blurState)) {\n          el.removeState(this.options.blurState);\n        }\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    if (e.element && this._marks && this._marks.includes(e.element.mark)) {\n      const highlightKey = e.element.key;\n\n      if (isNil(highlightKey)) {\n        return;\n      }\n      this._marks.forEach(mark => {\n        mark.elements.forEach(el => {\n          const isHighlight = el.key === highlightKey;\n\n          if (isHighlight) {\n            el.removeState(this.options.blurState);\n            el.addState(this.options.highlightState);\n          } else {\n            el.removeState(this.options.highlightState);\n            el.addState(this.options.blurState);\n          }\n        });\n      });\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const hasActiveElement = e.element && this._marks && this._marks.includes(e.element.mark);\n\n    if (hasActiveElement) {\n      this.clearPrevElements();\n    }\n  };\n}\n"]}

package/es/interactions/element-highlight-by-legend.d.ts

@@ -0,0 +1,17 @@
+import type { ElementHighlightByLegendOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+import { LegendEvent } from '@visactor/vrender-components';
+export declare class ElementHighlightByLegend extends BaseInteraction<ElementHighlightByLegendOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementHighlightByLegendOptions;
+    options: ElementHighlightByLegendOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementHighlightByLegendOptions);
+    protected getEvents(): {
+        type: LegendEvent;
+        handler: (e: InteractionEvent, element: IGlyphElement<any> | IElement) => void;
+    }[];
+    handleStart: (e: InteractionEvent, element: IElement | IGlyphElement) => void;
+    handleReset: (e: InteractionEvent) => void;
+}

package/es/interactions/element-highlight-by-legend.js

@@ -0,0 +1,46 @@
+import { InteractionStateEnum } from "../graph/enums";
+
+import { BaseInteraction } from "./base";
+
+import { LegendEvent } from "@visactor/vrender-components";
+
+import { isNil } from "@visactor/vutils";
+
+export class ElementHighlightByLegend extends BaseInteraction {
+    constructor(view, options) {
+        super(view, options), this.type = ElementHighlightByLegend.type, this.handleStart = (e, element) => {
+            var _a, _b;
+            const itemKey = null === (_b = null === (_a = e.detail) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b.id;
+            isNil(itemKey) || this._marks.forEach((mark => {
+                mark.elements.forEach((el => {
+                    el[this.options.filterType] === itemKey ? (el.removeState(this.options.blurState), 
+                    el.addState(this.options.highlightState)) : (el.removeState(this.options.highlightState), 
+                    el.addState(this.options.blurState));
+                }));
+            }));
+        }, this.handleReset = e => {
+            this._marks.forEach((mark => {
+                mark.elements.forEach((el => {
+                    el.removeState(this.options.blurState), el.removeState(this.options.highlightState);
+                }));
+            }));
+        }, this.options = Object.assign({}, ElementHighlightByLegend.defaultOptions, options), 
+        this._marks = view.getMarksBySelector(this.options.selector);
+    }
+    getEvents() {
+        return [ {
+            type: LegendEvent.legendItemHover,
+            handler: this.handleStart
+        }, {
+            type: LegendEvent.legendItemUnHover,
+            handler: this.handleReset
+        } ];
+    }
+}
+
+ElementHighlightByLegend.type = "element-highlight-by-legend", ElementHighlightByLegend.defaultOptions = {
+    highlightState: InteractionStateEnum.highlight,
+    blurState: InteractionStateEnum.blur,
+    filterType: "groupKey"
+};
+//# sourceMappingURL=element-highlight-by-legend.js.map

package/es/interactions/element-highlight-by-legend.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/interactions/element-highlight-by-legend.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAStD,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAEzC,MAAM,OAAO,wBAAyB,SAAQ,eAAgD;IAY5F,YAAY,IAAW,EAAE,OAAyC;QAChE,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAXvB,SAAI,GAAW,wBAAwB,CAAC,IAAI,CAAC;QA2B7C,gBAAW,GAAG,CAAC,CAAmB,EAAE,OAAiC,EAAE,EAAE;;YACvE,MAAM,OAAO,GAAG,MAAA,MAAA,CAAC,CAAC,MAAM,0CAAE,IAAI,0CAAE,EAAE,CAAC;YAEnC,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE;gBAClB,OAAO;aACR;YAED,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;oBACzB,MAAM,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,OAAO,CAAC;oBAE5D,IAAI,WAAW,EAAE;wBACf,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;wBACvC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;qBAC1C;yBAAM;wBACL,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;wBAC5C,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;qBACrC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;oBACzB,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;oBACvC,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;gBAC9C,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QA5CA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,wBAAwB,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QAEnF,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAES,SAAS;QACjB,OAAO;YACL;gBACE,IAAI,EAAE,WAAW,CAAC,eAAe;gBACjC,OAAO,EAAE,IAAI,CAAC,WAAW;aAC1B;YACD,EAAE,IAAI,EAAE,WAAW,CAAC,iBAAiB,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;SACnE,CAAC;IACJ,CAAC;;AA1BM,6BAAI,GAAW,6BAA6B,CAAC;AAG7C,uCAAc,GAAoC;IACvD,cAAc,EAAE,oBAAoB,CAAC,SAAS;IAC9C,SAAS,EAAE,oBAAoB,CAAC,IAAI;IACpC,UAAU,EAAE,UAAU;CACvB,CAAC","file":"element-highlight-by-legend.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type {\n  ElementHighlightByLegendOptions,\n  IElement,\n  IGlyphElement,\n  IMark,\n  IView,\n  InteractionEvent\n} from '../types';\nimport { BaseInteraction } from './base';\nimport { LegendEvent } from '@visactor/vrender-components';\nimport { isNil } from '@visactor/vutils';\n\nexport class ElementHighlightByLegend extends BaseInteraction<ElementHighlightByLegendOptions> {\n  static type: string = 'element-highlight-by-legend';\n  type: string = ElementHighlightByLegend.type;\n\n  static defaultOptions: ElementHighlightByLegendOptions = {\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByLegendOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByLegendOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByLegend.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: LegendEvent.legendItemHover,\n        handler: this.handleStart\n      },\n      { type: LegendEvent.legendItemUnHover, handler: this.handleReset }\n    ];\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const itemKey = e.detail?.data?.id;\n\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = el[this.options.filterType] === itemKey;\n\n        if (isHighlight) {\n          el.removeState(this.options.blurState);\n          el.addState(this.options.highlightState);\n        } else {\n          el.removeState(this.options.highlightState);\n          el.addState(this.options.blurState);\n        }\n      });\n    });\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(this.options.blurState);\n        el.removeState(this.options.highlightState);\n      });\n    });\n  };\n}\n"]}

package/es/interactions/element-highlight-by-name.d.ts

@@ -0,0 +1,18 @@
+import type { ElementHighlightByNameOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';
+import { BaseInteraction } from './base';
+export declare class ElementHighlightByName extends BaseInteraction<ElementHighlightByNameOptions> {
+    static type: string;
+    type: string;
+    static defaultOptions: ElementHighlightByNameOptions;
+    options: ElementHighlightByNameOptions;
+    protected _marks?: IMark[];
+    constructor(view: IView, options?: ElementHighlightByNameOptions);
+    protected getEvents(): {
+        type: import("../types").EventType;
+        handler: (e: InteractionEvent, element: IGlyphElement<any> | IElement) => void;
+    }[];
+    protected _filterByName(e: InteractionEvent): boolean;
+    protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement): any;
+    handleStart: (e: InteractionEvent, element: IElement | IGlyphElement) => void;
+    handleReset: (e: InteractionEvent) => void;
+}