@visactor/vgrammar-core 0.13.5 → 0.13.7

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-key.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,qBAAsB,SAAQ,eAAwC;IAajF,YAAY,IAAW,EAAE,OAAiC;QACxD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAZvB,SAAI,GAAW,qBAAqB,CAAC,IAAI,CAAC;QAuF1C,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;QACxB,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;QApFA,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;IAED,aAAa;QACX,OAAO,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;IACrC,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,UAAU,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;SAC7D,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,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;gBAC5C,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;YACzC,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,KAAK,CAAC,OAAoC;QACxC,IAAI,OAAO,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAChE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,CAAC;YAEjC,IAAI,KAAK,CAAC,YAAY,CAAC,EAAE;gBACvB,OAAO;aACR;YACD,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,GAAG,KAAK,YAAY,CAAC;oBAE5C,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;SACJ;IACH,CAAC;IAED,KAAK,CAAC,OAAoC;QACxC,IAAI,OAAO,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAChE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,CAAC;YAEjC,IAAI,KAAK,CAAC,YAAY,CAAC,EAAE;gBACvB,OAAO;aACR;YACD,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,GAAG,KAAK,YAAY,CAAC;oBAE5C,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;SACJ;IACH,CAAC;;AAtFM,0BAAI,GAAW,0BAA0B,CAAC;AAG1C,oCAAc,GAA4B;IAC/C,cAAc,EAAE,oBAAoB,CAAC,SAAS;IAC9C,SAAS,EAAE,oBAAoB,CAAC,IAAI;IACpC,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,YAAY;CACzB,CAAC","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    triggerOff: '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  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(this.options.highlightState);\n        el.removeState(this.options.blurState);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = 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  reset(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = 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  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\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"]}
+{"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    triggerOff: '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  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  clearPrevElements() {\n    const states = [this.options.highlightState, this.options.blurState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  start(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = 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.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  reset(element: InteractionEvent['element']) {\n    if (element && this._marks && this._marks.includes(element.mark)) {\n      const highlightKey = 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.updateStates({\n              [this.options.blurState]: false,\n              [this.options.highlightState]: true\n            });\n          } else {\n            el.updateStates({\n              [this.options.blurState]: true,\n              [this.options.highlightState]: false\n            });\n          }\n        });\n      });\n    }\n  }\n\n  handleStart = (e: InteractionEvent) => {\n    this.start(e.element);\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.js

@@ -35,15 +35,21 @@ export class ElementHighlightByLegend extends BaseInteraction {
         const filterValue = generateFilterValue(this.options);
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
-                filterValue(el) === itemKey ? (el.removeState(this.options.blurState), el.addState(this.options.highlightState)) : (el.removeState(this.options.highlightState), 
-                el.addState(this.options.blurState));
+                filterValue(el) === itemKey ? el.updateStates({
+                    [this.options.blurState]: !1,
+                    [this.options.highlightState]: !0
+                }) : el.updateStates({
+                    [this.options.blurState]: !0,
+                    [this.options.highlightState]: !1
+                });
             }));
         }));
     }
     reset() {
+        const states = [ this.options.blurState, this.options.highlightState ];
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
-                el.removeState(this.options.blurState), el.removeState(this.options.highlightState);
+                el.removeState(states);
             }));
         }));
     }

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

@@ -1 +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;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,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;QA6D7C,gBAAW,GAAG,CAAC,CAAmB,EAAE,OAAiC,EAAE,EAAE;;YACvE,IAAI,CAAC,KAAK,CAAC,MAAA,MAAA,CAAC,CAAC,MAAM,0CAAE,IAAI,0CAAE,EAAE,CAAC,CAAC;QACjC,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC,CAAC;QAvDA,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;IAED,aAAa;QACX,OAAO,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;IACrC,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;IAED,KAAK,CAAC,OAA0C;QAC9C,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE;YAClB,OAAO;SACR;QACD,MAAM,WAAW,GAAG,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtD,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBACzB,MAAM,WAAW,GAAG,WAAW,CAAC,EAAE,CAAC,KAAK,OAAO,CAAC;gBAEhD,IAAI,WAAW,EAAE;oBACf,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;oBACvC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;iBAC1C;qBAAM;oBACL,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;oBAC5C,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;iBACrC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,KAAK;QACH,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBACzB,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;gBACvC,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;YAC9C,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;;AA5DM,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';\nimport { generateFilterValue } from './utils';\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  getStartState(): string {\n    return this.options.highlightState;\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  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === 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  reset() {\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  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    this.start(e.detail?.data?.id);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset();\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-legend.ts"],"names":[],"mappings":"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","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';\nimport { generateFilterValue } from './utils';\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  getStartState(): string {\n    return this.options.highlightState;\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  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  reset() {\n    const states = [this.options.blurState, this.options.highlightState];\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    this.start(e.detail?.data?.id);\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    this.reset();\n  };\n}\n"]}

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

@@ -43,15 +43,21 @@ export class ElementHighlightByName extends BaseInteraction {
         const filterValue = generateFilterValue(this.options);
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
-                filterValue(el) === itemKey ? (el.removeState(this.options.blurState), el.addState(this.options.highlightState)) : (el.removeState(this.options.highlightState), 
-                el.addState(this.options.blurState));
+                filterValue(el) === itemKey ? el.updateStates({
+                    [this.options.blurState]: !1,
+                    [this.options.highlightState]: !0
+                }) : el.updateStates({
+                    [this.options.blurState]: !0,
+                    [this.options.highlightState]: !1
+                });
             }));
         }));
     }
     reset() {
+        const states = [ this.options.blurState, this.options.highlightState ];
         this._marks.forEach((mark => {
             mark.elements.forEach((el => {
-                el.removeState(this.options.blurState), el.removeState(this.options.highlightState);
+                el.removeState(states);
             }));
         }));
     }

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/interactions/element-highlight-by-name.ts"],"names":[],"mappings":"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","file":"element-highlight-by-name.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementHighlightByNameOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { array, isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByName extends BaseInteraction<ElementHighlightByNameOptions> {\n  static type: string = 'element-highlight-by-name';\n  type: string = ElementHighlightByName.type;\n\n  static defaultOptions: ElementHighlightByNameOptions = {\n    trigger: 'pointerover',\n    triggerOff: 'pointerout',\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByNameOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByNameOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByName.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  protected _filterByName(e: InteractionEvent) {\n    const names = array(this.options.graphicName);\n    return e?.target?.name && names.includes(e.target.name);\n  }\n\n  protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement) {\n    return this.options.parseData\n      ? this.options.parseData(e)\n      : e.target.type === 'text'\n      ? (e.target.attribute as any).text\n      : null;\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\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  reset() {\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  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const shoudStart = this.options.shouldStart ? this.options.shouldStart(e) : this._filterByName(e);\n    if (shoudStart) {\n      const itemKey = this._parseTargetKey(e, element);\n      this.start(itemKey);\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const shoudReset = this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e);\n\n    if (shoudReset) {\n      this.reset();\n    }\n  };\n}\n"]}
+{"version":3,"sources":["../src/interactions/element-highlight-by-name.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,MAAM,OAAO,sBAAuB,SAAQ,eAA8C;IAcxF,YAAY,IAAW,EAAE,OAAuC;QAC9D,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAbvB,SAAI,GAAW,sBAAsB,CAAC,IAAI,CAAC;QAiF3C,gBAAW,GAAG,CAAC,CAAmB,EAAE,OAAiC,EAAE,EAAE;YACvE,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YAClG,IAAI,UAAU,EAAE;gBACd,MAAM,OAAO,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;gBACjD,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;aACrB;QACH,CAAC,CAAC;QAEF,gBAAW,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;YAElG,IAAI,UAAU,EAAE;gBACd,IAAI,CAAC,KAAK,EAAE,CAAC;aACd;QACH,CAAC,CAAC;QAjFA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,sBAAsB,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QAEjF,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAED,aAAa;QACX,OAAO,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;IACrC,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,UAAU,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE;SAC7D,CAAC;IACJ,CAAC;IAES,aAAa,CAAC,CAAmB;;QACzC,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QAC9C,OAAO,CAAA,MAAA,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,MAAM,0CAAE,IAAI,KAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC1D,CAAC;IAES,eAAe,CAAC,CAAmB,EAAE,OAAiC;QAC9E,OAAO,IAAI,CAAC,OAAO,CAAC,SAAS;YAC3B,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC;YAC3B,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,KAAK,MAAM;gBAC1B,CAAC,CAAE,CAAC,CAAC,MAAM,CAAC,SAAiB,CAAC,IAAI;gBAClC,CAAC,CAAC,IAAI,CAAC;IACX,CAAC;IAED,KAAK,CAAC,OAA0C;QAC9C,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE;YAClB,OAAO;SACR;QAED,MAAM,WAAW,GAAG,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtD,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBACzB,MAAM,WAAW,GAAG,WAAW,CAAC,EAAE,CAAC,KAAK,OAAO,CAAC;gBAChD,IAAI,WAAW,EAAE;oBACf,EAAE,CAAC,YAAY,CAAC;wBACd,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,KAAK;wBAC/B,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,IAAI;qBACpC,CAAC,CAAC;iBACJ;qBAAM;oBACL,EAAE,CAAC,YAAY,CAAC;wBACd,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,IAAI;wBAC9B,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,KAAK;qBACrC,CAAC,CAAC;iBACJ;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,KAAK;QACH,MAAM,MAAM,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAErE,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gBACzB,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;YACzB,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;;AAhFM,2BAAI,GAAW,2BAA2B,CAAC;AAG3C,qCAAc,GAAkC;IACrD,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,YAAY;IACxB,cAAc,EAAE,oBAAoB,CAAC,SAAS;IAC9C,SAAS,EAAE,oBAAoB,CAAC,IAAI;IACpC,UAAU,EAAE,UAAU;CACvB,CAAC","file":"element-highlight-by-name.js","sourcesContent":["import { InteractionStateEnum } from '../graph/enums';\nimport type { ElementHighlightByNameOptions, IElement, IGlyphElement, IMark, IView, InteractionEvent } from '../types';\nimport { BaseInteraction } from './base';\nimport { array, isNil } from '@visactor/vutils';\nimport { generateFilterValue } from './utils';\n\nexport class ElementHighlightByName extends BaseInteraction<ElementHighlightByNameOptions> {\n  static type: string = 'element-highlight-by-name';\n  type: string = ElementHighlightByName.type;\n\n  static defaultOptions: ElementHighlightByNameOptions = {\n    trigger: 'pointerover',\n    triggerOff: 'pointerout',\n    highlightState: InteractionStateEnum.highlight,\n    blurState: InteractionStateEnum.blur,\n    filterType: 'groupKey'\n  };\n  options: ElementHighlightByNameOptions;\n  protected _marks?: IMark[];\n\n  constructor(view: IView, options?: ElementHighlightByNameOptions) {\n    super(view, options);\n    this.options = Object.assign({}, ElementHighlightByName.defaultOptions, options);\n\n    this._marks = view.getMarksBySelector(this.options.selector);\n  }\n\n  getStartState(): string {\n    return this.options.highlightState;\n  }\n\n  protected getEvents() {\n    return [\n      {\n        type: this.options.trigger,\n        handler: this.handleStart\n      },\n      { type: this.options.triggerOff, handler: this.handleReset }\n    ];\n  }\n\n  protected _filterByName(e: InteractionEvent) {\n    const names = array(this.options.graphicName);\n    return e?.target?.name && names.includes(e.target.name);\n  }\n\n  protected _parseTargetKey(e: InteractionEvent, element: IElement | IGlyphElement) {\n    return this.options.parseData\n      ? this.options.parseData(e)\n      : e.target.type === 'text'\n      ? (e.target.attribute as any).text\n      : null;\n  }\n\n  start(itemKey: IElement | IGlyphElement | string) {\n    if (isNil(itemKey)) {\n      return;\n    }\n\n    const filterValue = generateFilterValue(this.options);\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        const isHighlight = filterValue(el) === itemKey;\n        if (isHighlight) {\n          el.updateStates({\n            [this.options.blurState]: false,\n            [this.options.highlightState]: true\n          });\n        } else {\n          el.updateStates({\n            [this.options.blurState]: true,\n            [this.options.highlightState]: false\n          });\n        }\n      });\n    });\n  }\n\n  reset() {\n    const states = [this.options.blurState, this.options.highlightState];\n\n    this._marks.forEach(mark => {\n      mark.elements.forEach(el => {\n        el.removeState(states);\n      });\n    });\n  }\n\n  handleStart = (e: InteractionEvent, element: IElement | IGlyphElement) => {\n    const shoudStart = this.options.shouldStart ? this.options.shouldStart(e) : this._filterByName(e);\n    if (shoudStart) {\n      const itemKey = this._parseTargetKey(e, element);\n      this.start(itemKey);\n    }\n  };\n\n  handleReset = (e: InteractionEvent) => {\n    const shoudReset = this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e);\n\n    if (shoudReset) {\n      this.reset();\n    }\n  };\n}\n"]}

package/es/interactions/index.js

@@ -147,4 +147,5 @@ export const registerViewRoam = () => {
 
 export const registerFishEye = () => {
     Factory.registerInteraction(FishEye.type, FishEye);
-};
+};
+//# sourceMappingURL=index.js.map

package/es/interactions/legend-filter.js

@@ -29,4 +29,4 @@ export class LegendFilter extends Filter {
 }
 
 LegendFilter.type = "legend-filter", LegendFilter.defaultOptions = {};
-//# sourceMappingURL=legend-filter.js.map
+//# sourceMappingURL=legend-filter.js.map

package/es/interactions/player-filter.js

@@ -29,4 +29,4 @@ export class PlayerFilter extends Filter {
 }
 
 PlayerFilter.type = "player-filter", PlayerFilter.defaultOptions = {};
-//# sourceMappingURL=player-filter.js.map
+//# sourceMappingURL=player-filter.js.map

package/es/interactions/roll-up.js

@@ -42,4 +42,4 @@ RollUp.type = "roll-up", RollUp.defaultOptions = {
     trigger: "click",
     triggerOff: "empty"
 };
-//# sourceMappingURL=roll-up.js.map
+//# sourceMappingURL=roll-up.js.map

package/es/interactions/scrollbar-filter.js

@@ -50,4 +50,4 @@ export class ScrollbarFilter extends Filter {
 }
 
 ScrollbarFilter.type = "scrollbar-filter", ScrollbarFilter.defaultOptions = {};
-//# sourceMappingURL=scrollbar-filter.js.map
+//# sourceMappingURL=scrollbar-filter.js.map

package/es/interactions/slider-filter.js

@@ -26,4 +26,4 @@ export class SliderFilter extends Filter {
 }
 
 SliderFilter.type = "slider-filter", SliderFilter.defaultOptions = {};
-//# sourceMappingURL=slider-filter.js.map
+//# sourceMappingURL=slider-filter.js.map

package/es/interactions/toggle-state-mixin.js

@@ -44,4 +44,4 @@ export class ToggleStateMixin {
         }));
     }
 }
-//# sourceMappingURL=toggle-state-mixin.js.map
+//# sourceMappingURL=toggle-state-mixin.js.map

package/es/interactions/tooltip.js

@@ -56,4 +56,4 @@ Tooltip.type = "tooltip", Tooltip.defaultOptions = {
     trigger: "pointermove",
     triggerOff: "pointerleave"
 };
-//# sourceMappingURL=tooltip.js.map
+//# sourceMappingURL=tooltip.js.map

package/es/parse/coordinate.js

@@ -62,4 +62,4 @@ export function configureCoordinate(spec, coordinate, parameters) {
     }
     coordinate.applyTransforms(transforms);
 }
-//# sourceMappingURL=coordinate.js.map
+//# sourceMappingURL=coordinate.js.map

package/es/parse/event.js

@@ -24,4 +24,4 @@ export const parseEventSelector = (selector, source = EVENT_SOURCE_VIEW) => {
     } else 1 === splitArr.length && (spec.type = selector, spec.source = source);
     return spec;
 };
-//# sourceMappingURL=event.js.map
+//# sourceMappingURL=event.js.map

package/es/parse/mark.js

@@ -16,4 +16,4 @@ export function parseEncodeType(encoder, view) {
     return encoder.scale && (dependencies = isGrammar(encoder.scale) ? [ encoder.scale ] : array(view.getScaleById(encoder.scale))), 
     dependencies.concat(parseFunctionType(encoder, view));
 }
-//# sourceMappingURL=mark.js.map
+//# sourceMappingURL=mark.js.map

package/es/parse/option.js

@@ -8,4 +8,4 @@ export const parseOptions = (options, params) => options ? isObject(options) ? O
     const option = options[key];
     return res[key] = parseOptionValue(option, params), res;
 }), {}) : options.map((option => parseOptionValue(option, params))) : options;
-//# sourceMappingURL=option.js.map
+//# sourceMappingURL=option.js.map

package/es/parse/scale.js

@@ -343,5 +343,4 @@ export function configureScale(spec, scale, parameters) {
       case "quantile":
         scale.rescale();
     }
-}
-//# sourceMappingURL=scale.js.map
+}

package/es/parse/transform.js

@@ -99,4 +99,4 @@ export const parseTransformSpec = (spec, view) => {
     }
     return null;
 };
-//# sourceMappingURL=transform.js.map
+//# sourceMappingURL=transform.js.map

package/es/parse/util.js

@@ -62,4 +62,4 @@ export const isGrammar = el => el && !isNil(el.grammarType);
 export const parseField = field => isFunction(field) ? field : datum => datum[field];
 
 export const parseColor = color => isString(color) && Color.parseColorString(color) ? color : null;
-//# sourceMappingURL=util.js.map
+//# sourceMappingURL=util.js.map

package/es/parse/view.js

@@ -96,4 +96,4 @@ export const normalizeRunningConfig = runningConfig => {
         enableExitAnimation: enableExitAnimation
     };
 };
-//# sourceMappingURL=view.js.map
+//# sourceMappingURL=view.js.map

package/es/types/element.d.ts

@@ -1,7 +1,7 @@
 import type { IArc, IArc3d, IArea, ICircle, IGlyph, IGraphic, IGroup, IImage, ILine, IPath, IPolygon, IPyramid3d, IRect, IRect3d, IRichText, ISymbol, IText } from '@visactor/vrender-core';
 import type { DiffState } from '../graph/enums';
 import type { IMark, IGlyphMark } from './grammar';
-import type { BaseEncodeSpec, MarkFunctionType, MarkKeySpec, MarkType } from './mark';
+import type { BaseEncodeSpec, BaseSingleEncodeSpec, MarkFunctionType, MarkKeySpec, MarkType } from './mark';
 export interface ElementGraphicMap {
     circle: ICircle;
     arc: IArc;
@@ -93,6 +93,7 @@ export interface IElement {
     addState: (state: string | string[], attrs?: any) => boolean;
     removeState: (state: string | string[]) => boolean;
     useStates: (states: string[], noAnimation?: boolean) => boolean;
+    updateStates: (states: Record<string, boolean | BaseSingleEncodeSpec>) => any;
 }
 export interface IGlyphElement<P = any> extends IElement {
     mark: IGlyphMark;

package/es/types/element.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/types/element.ts"],"names":[],"mappings":"","file":"element.js","sourcesContent":["import type {\n  IArc,\n  IArc3d,\n  IArea,\n  ICircle,\n  IGlyph,\n  IGraphic,\n  IGroup,\n  IImage,\n  ILine,\n  IPath,\n  IPolygon,\n  IPyramid3d,\n  IRect,\n  IRect3d,\n  IRichText,\n  ISymbol,\n  IText\n} from '@visactor/vrender-core';\nimport type { DiffState } from '../graph/enums';\nimport type { IMark, IGlyphMark } from './grammar';\nimport type { BaseEncodeSpec, IMarkConfig, MarkFunctionType, MarkKeySpec, MarkType } from './mark';\n\nexport interface ElementGraphicMap {\n  circle: ICircle;\n  arc: IArc;\n  area: IArea;\n  image: IImage;\n  line: ILine;\n  path: IPath;\n  rule: ILine;\n  shape: IPath;\n  symbol: ISymbol;\n  text: IText;\n  richtext: IRichText;\n  polygon: IPolygon;\n  cell: ISymbol;\n  interval: IGraphic;\n  rect: IRect;\n  rect3d: IRect3d;\n  arc3d: IArc3d;\n  pyramid3d: IPyramid3d;\n  group: IGroup;\n  glyph: IGlyph;\n  linkPath: IGlyph;\n  treePath: IGlyph;\n  wave: IGlyph;\n  ripplePoint: IGlyph;\n  barBoxplot: IGlyph;\n  boxPlot: IGlyph;\n  component: IGroup;\n  axis: IGroup;\n  legend: IGroup;\n  corsshair: IGroup;\n  slider: IGroup;\n  datazoom: IGroup;\n  label: IGroup;\n  player: IGroup;\n}\n\nexport type GetGraphicByType<T> = T extends keyof ElementGraphicMap ? ElementGraphicMap[T] : IGraphic;\n\n/**\n * 保存graphicItem状态\n */\nexport interface MarkElementItem {\n  /** 唯一key */\n  key: string;\n  /** 原始数据 */\n  datum: any;\n  /** VGrammar view */\n  view: any;\n  /** 当前渲染帧下graphicItem对应的最新属性 */\n  nextAttrs?: any;\n  /** 是否初始化过，用于解决collection mark对应的item，可能跳过enter状态的问题 */\n  // hasEntered: boolean;\n}\nexport interface IElement {\n  mark: IMark;\n  isReserved: boolean;\n  diffState: DiffState;\n  key: string;\n  groupKey?: string;\n  data?: any[];\n  /**\n   * 不推荐使用，但是collection图元暂时可能回涉及到相关修改\n   */\n  items: MarkElementItem[];\n\n  initGraphicItem: (attrs?: any) => void;\n  updateGraphicItem: () => void;\n\n  getDatum: () => any;\n  getBounds: () => any;\n  getGraphicItem: () => IGraphic;\n  removeGraphicItem: () => void;\n  resetGraphicItem: () => void;\n\n  /**\n   * 获取 graphic 视觉通道属性\n   * @param channel 视觉通道\n   * @param prev 是否从之前的 graphic 属性上获取，默认为 false\n   * @returns 视觉通道值\n   */\n  getGraphicAttribute: (channel: string, prev?: boolean) => any;\n  /**\n   * 设置 graphic 视觉通道属性\n   * @param channel 视觉通道\n   * @param value 视觉通道属性\n   * @param final 是否更新 graphic 最终变更的视觉通道结果，默认为 false\n   */\n  setGraphicAttribute: (channel: string, value: any, final?: boolean) => void;\n  /**\n   * 设置一系列 graphic 视觉通道属性\n   * @param attributes 视觉通道键值对\n   * @param final 是否更新 graphic 最终变更的视觉通道结果，默认为 false\n   */\n  setGraphicAttributes: (attributes: { [channel: string]: any }, final?: boolean) => void;\n\n  /**\n   * 【慎重使用】获取 VGrammar 自身的视觉通道属性\n   * 只有在 'afterEncodeItems' 时机的mark transform中才能调用\n   */\n  getItemAttribute: (channel?: string) => any;\n  /**\n   * 【慎重使用】设置 VGrammar 自身的视觉通道\n   * 只有在 'afterEncodeItems' 时机的mark transform中才能调用\n   * @param attributes\n   * @returns\n   */\n  setItemAttributes: (attributes: { [channel: string]: any } | any[]) => void;\n\n  // element 执行流程相关接口\n  updateData: (groupKey: string, data: any[], keyGenerator: MarkKeySpec, view: any) => void;\n  state: (markState: MarkFunctionType<string | string[]>, parameters?: any) => void;\n  encodeItems: (items: MarkElementItem[], encoders: BaseEncodeSpec, isReentered?: boolean, parameters?: any) => void;\n  encodeGraphic: (attributes?: any) => void;\n  transformElementItems: (items: MarkElementItem[], markType: MarkType, computePoints?: boolean) => Record<string, any>;\n  remove: () => void;\n  release: () => void;\n\n  // 动画相关接口\n\n  getFinalGraphicAttributes: () => { [key: string]: any };\n  getPrevGraphicAttributes: () => { [key: string]: any };\n  getNextGraphicAttributes: () => { [key: string]: any };\n  clearChangedGraphicAttributes: () => void;\n  clearGraphicAttributes: () => void;\n\n  // state相关接口\n  getStates: () => string[];\n  hasState: (state: string) => boolean;\n  clearStates: (noAnimation?: boolean) => void;\n  addState: (state: string | string[], attrs?: any) => boolean;\n  removeState: (state: string | string[]) => boolean;\n  useStates: (states: string[], noAnimation?: boolean) => boolean;\n}\n\nexport interface IGlyphElement<P = any> extends IElement {\n  mark: IGlyphMark;\n\n  getGlyphGraphicItems: () => { [markName: string]: any };\n\n  getGraphicAttribute: (channel: string, prev?: boolean, markName?: any) => any;\n  setGraphicAttribute: (channel: string, value: any, final?: boolean, markName?: any) => void;\n  setGraphicAttributes: (attributes: { [channel: string]: any }, final?: boolean, markName?: any) => void;\n\n  getFinalGraphicAttributes: (markName?: string) => { [key: string]: any };\n  getPrevGraphicAttributes: (markName?: string) => { [key: string]: any };\n  getNextGraphicAttributes: (markName?: string) => { [key: string]: any };\n\n  encodeCustom: (nextAttrs?: any) => { [markName: string]: any };\n}\n"]}
+{"version":3,"sources":["../src/types/element.ts"],"names":[],"mappings":"","file":"element.js","sourcesContent":["import type {\n  IArc,\n  IArc3d,\n  IArea,\n  ICircle,\n  IGlyph,\n  IGraphic,\n  IGroup,\n  IImage,\n  ILine,\n  IPath,\n  IPolygon,\n  IPyramid3d,\n  IRect,\n  IRect3d,\n  IRichText,\n  ISymbol,\n  IText\n} from '@visactor/vrender-core';\nimport type { DiffState } from '../graph/enums';\nimport type { IMark, IGlyphMark } from './grammar';\nimport type {\n  BaseEncodeSpec,\n  BaseSingleEncodeSpec,\n  IMarkConfig,\n  MarkFunctionType,\n  MarkKeySpec,\n  MarkType\n} from './mark';\n\nexport interface ElementGraphicMap {\n  circle: ICircle;\n  arc: IArc;\n  area: IArea;\n  image: IImage;\n  line: ILine;\n  path: IPath;\n  rule: ILine;\n  shape: IPath;\n  symbol: ISymbol;\n  text: IText;\n  richtext: IRichText;\n  polygon: IPolygon;\n  cell: ISymbol;\n  interval: IGraphic;\n  rect: IRect;\n  rect3d: IRect3d;\n  arc3d: IArc3d;\n  pyramid3d: IPyramid3d;\n  group: IGroup;\n  glyph: IGlyph;\n  linkPath: IGlyph;\n  treePath: IGlyph;\n  wave: IGlyph;\n  ripplePoint: IGlyph;\n  barBoxplot: IGlyph;\n  boxPlot: IGlyph;\n  component: IGroup;\n  axis: IGroup;\n  legend: IGroup;\n  corsshair: IGroup;\n  slider: IGroup;\n  datazoom: IGroup;\n  label: IGroup;\n  player: IGroup;\n}\n\nexport type GetGraphicByType<T> = T extends keyof ElementGraphicMap ? ElementGraphicMap[T] : IGraphic;\n\n/**\n * 保存graphicItem状态\n */\nexport interface MarkElementItem {\n  /** 唯一key */\n  key: string;\n  /** 原始数据 */\n  datum: any;\n  /** VGrammar view */\n  view: any;\n  /** 当前渲染帧下graphicItem对应的最新属性 */\n  nextAttrs?: any;\n  /** 是否初始化过，用于解决collection mark对应的item，可能跳过enter状态的问题 */\n  // hasEntered: boolean;\n}\nexport interface IElement {\n  mark: IMark;\n  isReserved: boolean;\n  diffState: DiffState;\n  key: string;\n  groupKey?: string;\n  data?: any[];\n  /**\n   * 不推荐使用，但是collection图元暂时可能回涉及到相关修改\n   */\n  items: MarkElementItem[];\n\n  initGraphicItem: (attrs?: any) => void;\n  updateGraphicItem: () => void;\n\n  getDatum: () => any;\n  getBounds: () => any;\n  getGraphicItem: () => IGraphic;\n  removeGraphicItem: () => void;\n  resetGraphicItem: () => void;\n\n  /**\n   * 获取 graphic 视觉通道属性\n   * @param channel 视觉通道\n   * @param prev 是否从之前的 graphic 属性上获取，默认为 false\n   * @returns 视觉通道值\n   */\n  getGraphicAttribute: (channel: string, prev?: boolean) => any;\n  /**\n   * 设置 graphic 视觉通道属性\n   * @param channel 视觉通道\n   * @param value 视觉通道属性\n   * @param final 是否更新 graphic 最终变更的视觉通道结果，默认为 false\n   */\n  setGraphicAttribute: (channel: string, value: any, final?: boolean) => void;\n  /**\n   * 设置一系列 graphic 视觉通道属性\n   * @param attributes 视觉通道键值对\n   * @param final 是否更新 graphic 最终变更的视觉通道结果，默认为 false\n   */\n  setGraphicAttributes: (attributes: { [channel: string]: any }, final?: boolean) => void;\n\n  /**\n   * 【慎重使用】获取 VGrammar 自身的视觉通道属性\n   * 只有在 'afterEncodeItems' 时机的mark transform中才能调用\n   */\n  getItemAttribute: (channel?: string) => any;\n  /**\n   * 【慎重使用】设置 VGrammar 自身的视觉通道\n   * 只有在 'afterEncodeItems' 时机的mark transform中才能调用\n   * @param attributes\n   * @returns\n   */\n  setItemAttributes: (attributes: { [channel: string]: any } | any[]) => void;\n\n  // element 执行流程相关接口\n  updateData: (groupKey: string, data: any[], keyGenerator: MarkKeySpec, view: any) => void;\n  state: (markState: MarkFunctionType<string | string[]>, parameters?: any) => void;\n  encodeItems: (items: MarkElementItem[], encoders: BaseEncodeSpec, isReentered?: boolean, parameters?: any) => void;\n  encodeGraphic: (attributes?: any) => void;\n  transformElementItems: (items: MarkElementItem[], markType: MarkType, computePoints?: boolean) => Record<string, any>;\n  remove: () => void;\n  release: () => void;\n\n  // 动画相关接口\n\n  getFinalGraphicAttributes: () => { [key: string]: any };\n  getPrevGraphicAttributes: () => { [key: string]: any };\n  getNextGraphicAttributes: () => { [key: string]: any };\n  clearChangedGraphicAttributes: () => void;\n  clearGraphicAttributes: () => void;\n\n  // state相关接口\n  getStates: () => string[];\n  hasState: (state: string) => boolean;\n  clearStates: (noAnimation?: boolean) => void;\n  addState: (state: string | string[], attrs?: any) => boolean;\n  removeState: (state: string | string[]) => boolean;\n  useStates: (states: string[], noAnimation?: boolean) => boolean;\n  updateStates: (states: Record<string, boolean | BaseSingleEncodeSpec>) => any;\n}\n\nexport interface IGlyphElement<P = any> extends IElement {\n  mark: IGlyphMark;\n\n  getGlyphGraphicItems: () => { [markName: string]: any };\n\n  getGraphicAttribute: (channel: string, prev?: boolean, markName?: any) => any;\n  setGraphicAttribute: (channel: string, value: any, final?: boolean, markName?: any) => void;\n  setGraphicAttributes: (attributes: { [channel: string]: any }, final?: boolean, markName?: any) => void;\n\n  getFinalGraphicAttributes: (markName?: string) => { [key: string]: any };\n  getPrevGraphicAttributes: (markName?: string) => { [key: string]: any };\n  getNextGraphicAttributes: (markName?: string) => { [key: string]: any };\n\n  encodeCustom: (nextAttrs?: any) => { [markName: string]: any };\n}\n"]}

package/es/view/group.js

@@ -48,9 +48,12 @@ export class GroupMark extends Mark {
     }
     getChannelsFromConfig(element) {
         const spec = this.spec, initAttrs = {};
-        return isNil(spec.clip) || (initAttrs.clip = spec.clip), isNil(spec.zIndex) || (initAttrs.zIndex = spec.zIndex), 
-        isNil(spec.clipPath) || (initAttrs.path = isFunction(spec.clipPath) ? spec.clipPath([ element ]) : spec.clipPath), 
-        isNil(spec.interactive) || (initAttrs.pickable = spec.interactive), initAttrs;
+        if (isNil(spec.clip) || (initAttrs.clip = spec.clip), isNil(spec.zIndex) || (initAttrs.zIndex = spec.zIndex), 
+        !isNil(spec.clipPath)) {
+            const paths = isFunction(spec.clipPath) ? spec.clipPath([ element ]) : spec.clipPath;
+            paths && paths.length ? initAttrs.path = paths : (initAttrs.path = null, initAttrs.clip = !1);
+        }
+        return isNil(spec.interactive) || (initAttrs.pickable = spec.interactive), initAttrs;
     }
     evaluateGroupEncode(elements, groupEncode, parameters) {
         var _a;

package/es/view/group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/view/group.ts"],"names":[],"mappings":"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","file":"group.js","sourcesContent":["import type { INode } from '@visactor/vrender-core';\nimport { transformsByType } from '../graph/attributes';\nimport { DefaultKey, DefaultMarkData } from '../graph/constants';\nimport { BuiltInEncodeNames, GrammarMarkType, HOOK_EVENT } from '../graph/enums';\nimport { createElement } from '../graph/util/element';\nimport { createGraphicItem } from '../graph/util/graphic';\nimport type { IElement, IGlyphMark, IGroupMark, IMark, IView } from '../types';\nimport { Mark } from './mark';\nimport { isFunction, isNil } from '@visactor/vutils';\nimport { invokeEncoderToItems } from '../graph/mark/encode';\n\nexport class GroupMark extends Mark implements IGroupMark {\n  children: (IMark | IGroupMark | IGlyphMark)[];\n\n  layoutChildren?: (IMark | IGroupMark | IGlyphMark)[];\n\n  constructor(view: IView, group?: IGroupMark) {\n    super(view, GrammarMarkType.group, group);\n    this.children = [];\n  }\n\n  parseRenderContext() {\n    return { large: false };\n  }\n\n  appendChild(mark: IMark) {\n    this.children.push(mark);\n    return this;\n  }\n  removeChild(mark: IMark) {\n    this.children = this.children.filter(child => child !== mark);\n    return this;\n  }\n\n  includesChild(mark: IMark, descendant: boolean = true) {\n    if (this.children.includes(mark)) {\n      return true;\n    }\n    if (!descendant) {\n      return false;\n    }\n    return this.children.some(child => {\n      if (child.markType === GrammarMarkType.group) {\n        return (child as IGroupMark).includesChild(mark, true);\n      }\n      return false;\n    });\n  }\n\n  updateLayoutChildren() {\n    if (!this.children.length) {\n      return this;\n    }\n    if (!this.layoutChildren) {\n      this.layoutChildren = [];\n    }\n\n    this.layoutChildren = this.children.filter(child => child.needLayout());\n\n    return this;\n  }\n\n  getAttributeTransforms() {\n    return transformsByType.rect;\n  }\n\n  protected evaluateJoin(data: any[]) {\n    if (!this.elements.length) {\n      const el = createElement(this);\n\n      el.updateData(DefaultKey, DefaultMarkData, () => '', this.view);\n      this.elements = [el];\n      this.elementMap.set(DefaultKey, el);\n    }\n  }\n\n  protected getChannelsFromConfig(element?: IElement) {\n    const spec = this.spec;\n\n    const initAttrs: any = {};\n\n    if (!isNil(spec.clip)) {\n      initAttrs.clip = spec.clip;\n    }\n\n    if (!isNil(spec.zIndex)) {\n      initAttrs.zIndex = spec.zIndex;\n    }\n\n    if (!isNil(spec.clipPath)) {\n      initAttrs.path = isFunction(spec.clipPath) ? spec.clipPath([element]) : spec.clipPath;\n    }\n\n    if (!isNil(spec.interactive)) {\n      initAttrs.pickable = spec.interactive;\n    }\n\n    return initAttrs;\n  }\n\n  protected evaluateGroupEncode(elements: IElement[], groupEncode: any, parameters: any) {\n    const el = this.elements[0];\n    const nextAttrs = {};\n    const items = [Object.assign({}, el.items?.[0], { nextAttrs })];\n    invokeEncoderToItems(el, items, groupEncode, parameters);\n\n    this._groupEncodeResult = nextAttrs;\n    return nextAttrs;\n  }\n\n  protected evaluateEncode(elements: IElement[], encoders: any, parameters: any, noGroupEncode?: boolean) {\n    const initAttrs = this.getChannelsFromConfig();\n\n    if (encoders) {\n      this.emit(HOOK_EVENT.BEFORE_ELEMENT_ENCODE, { encoders, parameters }, this);\n\n      const groupEncodeAttrs = noGroupEncode\n        ? null\n        : this.evaluateGroupEncode(elements, encoders[BuiltInEncodeNames.group], parameters);\n\n      elements.forEach(element => {\n        element.items.forEach(item => {\n          item.nextAttrs = Object.assign(item.nextAttrs, initAttrs, groupEncodeAttrs);\n        });\n\n        element.encodeItems(element.items, encoders, this._isReentered, parameters);\n      });\n\n      this._isReentered = false;\n\n      this.evaluateTransform(this._getTransformsAfterEncodeItems(), elements, parameters);\n\n      elements.forEach(element => {\n        element.encodeGraphic();\n      });\n      this.emit(HOOK_EVENT.AFTER_ELEMENT_ENCODE, { encoders, parameters }, this);\n    } else {\n      elements.forEach(element => {\n        element.initGraphicItem(initAttrs);\n      });\n    }\n  }\n\n  addGraphicItem(attrs: any, groupKey?: string, newGraphicItem?: any) {\n    const graphicItem: any = newGraphicItem ?? createGraphicItem(this, this.markType, attrs);\n\n    if (!graphicItem) {\n      return;\n    }\n\n    this.emit(HOOK_EVENT.BEFORE_ADD_VRENDER_MARK, { graphicItem });\n\n    graphicItem.name = `${this.id() || this.markType}`;\n\n    this.graphicParent.insertIntoKeepIdx(graphicItem as unknown as INode, this.graphicIndex);\n    this.emit(HOOK_EVENT.AFTER_ADD_VRENDER_MARK, { graphicItem });\n\n    return graphicItem;\n  }\n}\n"]}
+{"version":3,"sources":["../src/view/group.ts"],"names":[],"mappings":"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","file":"group.js","sourcesContent":["import type { INode } from '@visactor/vrender-core';\nimport { transformsByType } from '../graph/attributes';\nimport { DefaultKey, DefaultMarkData } from '../graph/constants';\nimport { BuiltInEncodeNames, GrammarMarkType, HOOK_EVENT } from '../graph/enums';\nimport { createElement } from '../graph/util/element';\nimport { createGraphicItem } from '../graph/util/graphic';\nimport type { IElement, IGlyphMark, IGroupMark, IMark, IView } from '../types';\nimport { Mark } from './mark';\nimport { isFunction, isNil } from '@visactor/vutils';\nimport { invokeEncoderToItems } from '../graph/mark/encode';\n\nexport class GroupMark extends Mark implements IGroupMark {\n  children: (IMark | IGroupMark | IGlyphMark)[];\n\n  layoutChildren?: (IMark | IGroupMark | IGlyphMark)[];\n\n  constructor(view: IView, group?: IGroupMark) {\n    super(view, GrammarMarkType.group, group);\n    this.children = [];\n  }\n\n  parseRenderContext() {\n    return { large: false };\n  }\n\n  appendChild(mark: IMark) {\n    this.children.push(mark);\n    return this;\n  }\n  removeChild(mark: IMark) {\n    this.children = this.children.filter(child => child !== mark);\n    return this;\n  }\n\n  includesChild(mark: IMark, descendant: boolean = true) {\n    if (this.children.includes(mark)) {\n      return true;\n    }\n    if (!descendant) {\n      return false;\n    }\n    return this.children.some(child => {\n      if (child.markType === GrammarMarkType.group) {\n        return (child as IGroupMark).includesChild(mark, true);\n      }\n      return false;\n    });\n  }\n\n  updateLayoutChildren() {\n    if (!this.children.length) {\n      return this;\n    }\n    if (!this.layoutChildren) {\n      this.layoutChildren = [];\n    }\n\n    this.layoutChildren = this.children.filter(child => child.needLayout());\n\n    return this;\n  }\n\n  getAttributeTransforms() {\n    return transformsByType.rect;\n  }\n\n  protected evaluateJoin(data: any[]) {\n    if (!this.elements.length) {\n      const el = createElement(this);\n\n      el.updateData(DefaultKey, DefaultMarkData, () => '', this.view);\n      this.elements = [el];\n      this.elementMap.set(DefaultKey, el);\n    }\n  }\n\n  protected getChannelsFromConfig(element?: IElement) {\n    const spec = this.spec;\n\n    const initAttrs: any = {};\n\n    if (!isNil(spec.clip)) {\n      initAttrs.clip = spec.clip;\n    }\n\n    if (!isNil(spec.zIndex)) {\n      initAttrs.zIndex = spec.zIndex;\n    }\n\n    if (!isNil(spec.clipPath)) {\n      const paths = isFunction(spec.clipPath) ? spec.clipPath([element]) : spec.clipPath;\n\n      if (paths && paths.length) {\n        initAttrs.path = paths;\n      } else {\n        initAttrs.path = null;\n        initAttrs.clip = false;\n      }\n    }\n\n    if (!isNil(spec.interactive)) {\n      initAttrs.pickable = spec.interactive;\n    }\n\n    return initAttrs;\n  }\n\n  protected evaluateGroupEncode(elements: IElement[], groupEncode: any, parameters: any) {\n    const el = this.elements[0];\n    const nextAttrs = {};\n    const items = [Object.assign({}, el.items?.[0], { nextAttrs })];\n    invokeEncoderToItems(el, items, groupEncode, parameters);\n\n    this._groupEncodeResult = nextAttrs;\n    return nextAttrs;\n  }\n\n  protected evaluateEncode(elements: IElement[], encoders: any, parameters: any, noGroupEncode?: boolean) {\n    const initAttrs = this.getChannelsFromConfig();\n\n    if (encoders) {\n      this.emit(HOOK_EVENT.BEFORE_ELEMENT_ENCODE, { encoders, parameters }, this);\n\n      const groupEncodeAttrs = noGroupEncode\n        ? null\n        : this.evaluateGroupEncode(elements, encoders[BuiltInEncodeNames.group], parameters);\n\n      elements.forEach(element => {\n        element.items.forEach(item => {\n          item.nextAttrs = Object.assign(item.nextAttrs, initAttrs, groupEncodeAttrs);\n        });\n\n        element.encodeItems(element.items, encoders, this._isReentered, parameters);\n      });\n\n      this._isReentered = false;\n\n      this.evaluateTransform(this._getTransformsAfterEncodeItems(), elements, parameters);\n\n      elements.forEach(element => {\n        element.encodeGraphic();\n      });\n      this.emit(HOOK_EVENT.AFTER_ELEMENT_ENCODE, { encoders, parameters }, this);\n    } else {\n      elements.forEach(element => {\n        element.initGraphicItem(initAttrs);\n      });\n    }\n  }\n\n  addGraphicItem(attrs: any, groupKey?: string, newGraphicItem?: any) {\n    const graphicItem: any = newGraphicItem ?? createGraphicItem(this, this.markType, attrs);\n\n    if (!graphicItem) {\n      return;\n    }\n\n    this.emit(HOOK_EVENT.BEFORE_ADD_VRENDER_MARK, { graphicItem });\n\n    graphicItem.name = `${this.id() || this.markType}`;\n\n    this.graphicParent.insertIntoKeepIdx(graphicItem as unknown as INode, this.graphicIndex);\n    this.emit(HOOK_EVENT.AFTER_ADD_VRENDER_MARK, { graphicItem });\n\n    return graphicItem;\n  }\n}\n"]}

package/es/view/mark.js

@@ -263,12 +263,20 @@ export class Mark extends GrammarBase {
         this.graphicIndex = markIndex;
     }
     update(spec) {
-        this._context = this.spec.context, this.isUpdated = !0, this.renderContext.progressive || (spec.animation && this.animate.updateConfig(spec.animation), 
-        this.animate.updateState(spec.animationState)), this.markType !== GrammarMarkType.group ? (isNil(spec.zIndex) || this.graphicItem.setAttribute("zIndex", spec.zIndex), 
-        isNil(spec.clip) || this.graphicItem.setAttribute("clip", spec.clip), isNil(spec.clipPath) || this.graphicItem.setAttribute("path", isArray(spec.clipPath) ? spec.clipPath : spec.clipPath(this.elements)), 
-        this.elementMap.forEach((element => {
-            element.updateGraphicItem();
-        }))) : this.elementMap.forEach((element => {
+        if (this._context = this.spec.context, this.isUpdated = !0, this.renderContext.progressive || (spec.animation && this.animate.updateConfig(spec.animation), 
+        this.animate.updateState(spec.animationState)), this.markType !== GrammarMarkType.group) {
+            if (isNil(spec.zIndex) || this.graphicItem.setAttribute("zIndex", spec.zIndex), 
+            isNil(spec.clip) || this.graphicItem.setAttribute("clip", spec.clip), !isNil(spec.clipPath)) {
+                const paths = isArray(spec.clipPath) ? spec.clipPath : spec.clipPath(this.elements);
+                paths && paths.length ? this.graphicItem.setAttribute("path", paths) : this.graphicItem.setAttributes({
+                    path: paths,
+                    clip: !1
+                });
+            }
+            this.elementMap.forEach((element => {
+                element.updateGraphicItem();
+            }));
+        } else this.elementMap.forEach((element => {
             element.updateGraphicItem();
         }));
     }