@visactor/vchart
Version:
charts lib based @visactor/VGrammar
73 lines (66 loc) • 3.44 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.registerElementHighlightByLegend = exports.ElementHighlightByLegend = void 0;
const factory_1 = require("../../core/factory"), base_1 = require("./base"), interface_1 = require("../../compile/mark/interface"), event_1 = require("../../constant/event"), util_1 = require("./util"), type = "element-highlight-by-legend", defaultOptions = {
highlightState: interface_1.STATE_VALUE_ENUM.STATE_HIGHLIGHT,
blurState: interface_1.STATE_VALUE_ENUM.STATE_BLUR,
filterType: "groupKey"
};
class ElementHighlightByLegend extends base_1.BaseTrigger {
constructor(options) {
super(options), this.type = type, this.handleStart = e => {
var _a, _b;
const event = e.event;
event && this.start(null === (_b = null === (_a = event.detail) || void 0 === _a ? void 0 : _a.data) || void 0 === _b ? void 0 : _b.id);
}, this.handleReset = 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: event_1.ChartEvent.legendItemHover,
handler: this.handleStart
}, {
type: event_1.ChartEvent.legendItemUnHover,
handler: this.handleReset
} ];
}
start(itemKey) {
if (itemKey) {
const filterValue = (0, util_1.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();
}
}
exports.ElementHighlightByLegend = ElementHighlightByLegend, ElementHighlightByLegend.type = type,
ElementHighlightByLegend.defaultOptions = defaultOptions;
const registerElementHighlightByLegend = () => {
factory_1.Factory.registerInteractionTrigger(type, ElementHighlightByLegend);
};
exports.registerElementHighlightByLegend = registerElementHighlightByLegend;
//# sourceMappingURL=element-highlight-by-legend.js.map