@visactor/vchart/esm/interaction/triggers/element-highlight-by-name.js

charts lib based @visactor/VGrammar

import { Factory } from "../../core/factory";

import { BaseTrigger } from "./base";

import { STATE_VALUE_ENUM } from "../../compile/mark/interface";

import { array } from "@visactor/vutils";

import { generateFilterValue } from "./util";

const type = "element-highlight-by-name", defaultOptions = {
    highlightState: STATE_VALUE_ENUM.STATE_HIGHLIGHT,
    blurState: STATE_VALUE_ENUM.STATE_BLUR,
    filterType: "groupKey"
};

export class ElementHighlightByName extends BaseTrigger {
    constructor(options) {
        super(options), this.type = type, this.handleStart = e => {
            if (this.options.shouldStart ? this.options.shouldStart(e) : this._filterByName(e)) {
                const itemKey = this._parseTargetKey(e);
                this.start(itemKey);
            }
        }, this.handleReset = e => {
            (this.options.shouldReset ? this.options.shouldReset(e) : this._filterByName(e)) && this.resetAll();
        }, this.options = Object.assign({}, defaultOptions, options), this.updateMarkIdByState([ this.options.highlightState, this.options.blurState ]);
    }
    getStartState() {
        return this.options.highlightState;
    }
    getResetState() {
        return this.options.blurState;
    }
    getEvents() {
        return [ {
            type: this.options.trigger,
            handler: this.handleStart
        }, {
            type: this.options.triggerOff,
            handler: this.handleReset
        } ];
    }
    _filterByName(e) {
        var _a;
        const names = array(this.options.graphicName);
        return (null === (_a = null == e ? void 0 : e.node) || void 0 === _a ? void 0 : _a.name) && names.includes(e.node.name);
    }
    _parseTargetKey(e) {
        return this.options.parseData ? this.options.parseData(e) : "text" === e.node.type ? e.node.attribute.text : null;
    }
    start(itemKey) {
        if (itemKey) {
            const filterValue = generateFilterValue(this.options), {interaction: interaction, highlightState: highlightState, blurState: blurState} = this.options, statedGraphics = interaction.getStatedGraphics(this), newStatedGraphics = [];
            this.getMarks().forEach((m => {
                var _a;
                null === (_a = m.getGraphics()) || void 0 === _a || _a.forEach((g => {
                    filterValue(g) === itemKey && newStatedGraphics.push(g);
                }));
            })), interaction.updateStates(this, newStatedGraphics, statedGraphics, highlightState, blurState), 
            interaction.setStatedGraphics(this, newStatedGraphics);
        }
    }
    resetAll() {
        const {interaction: interaction, highlightState: highlightState, blurState: blurState} = this.options;
        interaction.clearAllStatesOfTrigger(this, highlightState, blurState), interaction.setStatedGraphics(this, []);
    }
    reset(g) {
        const {highlightState: highlightState, blurState: blurState, interaction: interaction} = this.options;
        if (g) {
            const statedGraphics = interaction.getStatedGraphics(this);
            statedGraphics && statedGraphics.includes(g) && (g.removeState([ highlightState, blurState ]), 
            interaction.setStatedGraphics(this, statedGraphics.filter((sg => sg !== g))));
        } else this.resetAll();
    }
}

ElementHighlightByName.type = type, ElementHighlightByName.defaultOptions = defaultOptions;

export const registerElementHighlightByName = () => {
    Factory.registerInteractionTrigger(type, ElementHighlightByName);
};
//# sourceMappingURL=element-highlight-by-name.js.map