UNPKG

@visactor/vgrammar-core

Version:

VGrammar is a visual grammar library

103 lines (99 loc) 4.94 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: !0 }), exports.FishEye = void 0; const vutils_1 = require("@visactor/vutils"), base_1 = require("./base"); class FishEye extends base_1.BaseInteraction { constructor(view, options) { super(view, options), this.type = FishEye.type, this.handleStart = e => { e && (this.options.shouldStart ? this.options.shouldStart(e) : this.shouldHandle(e)) && (this._inited || this._initGrammars(), this._isActive || (this._isActive = !0, this.updateView({ x: e.canvasX, y: e.canvasY }, e))); }, this.handleUpdateInner = e => { e && (this.options.shouldUpdate ? this.options.shouldUpdate(e) : this.shouldUpdate(e)) && this._isActive && this.updateView({ x: e.canvasX, y: e.canvasY }, e); }, this.handleEnd = e => { e && (this.options.shouldEnd ? this.options.shouldEnd(e) : this.shouldHandle(e)) && !this.options.triggerOff && this._isActive && (this._isActive = !1, this.updateView(null, e)); }, this.handleReset = e => { e && (this.options.shouldReset ? this.options.shouldReset(e) : this.shouldHandle(e)) && this._isActive && (this.updateView(null, e), this._isActive = !1); }, this.options = Object.assign({}, FishEye.defaultOptions, options), this._marks = view.getMarksBySelector(this.options.selector), this.handleUpdate = (0, vutils_1.throttle)(this.handleUpdateInner, this.options.throttle); } getEvents() { return [ { type: this.options.trigger, handler: this.handleStart }, { type: this.options.updateTrigger, handler: this.handleUpdate }, { type: this.options.endTrigger, handler: this.handleEnd }, { type: this.options.triggerOff, handler: this.handleReset } ]; } _initStateByDim(dim, distortion, scale, radius, radiusRatio) { const scaleGrammar = (0, vutils_1.isNil)(scale) ? null : (0, vutils_1.isString)(scale) ? this.view.getScaleById(scale) : scale; this._state[dim] = { scale: scaleGrammar, distortion: distortion, radius: radius, radiusRatio: radiusRatio }; } _initGrammars() { const {enableX: enableX, enableY: enableY, scaleX: scaleX, scaleY: scaleY, distortionX: distortionX, distortionY: distortionY, radiusRatioX: radiusRatioX, radiusRatioY: radiusRatioY, radiusX: radiusX, radiusY: radiusY} = this.options; this._state = {}, !1 !== enableX && this._initStateByDim("x", distortionX, scaleX, radiusX, radiusRatioX), !1 !== enableY && this._initStateByDim("y", distortionY, scaleY, radiusY, radiusRatioY), this._inited = !0; } updateView(focus, e) { let needUpdate = !1; focus ? Object.keys(this._state).forEach((dim => { const dimState = this._state[dim]; dimState.scale && dimState.focus !== focus[dim] && (needUpdate = !0, dimState.focus = focus[dim], dimState.scale.setFishEye({ distortion: dimState.distortion, radius: dimState.radius, radiusRatio: dimState.radiusRatio, focus: focus[dim] }), dimState.scale.commit()); })) : Object.keys(this._state).forEach((dim => { const dimState = this._state[dim]; dimState.scale && !(0, vutils_1.isNil)(dimState.focus) && (needUpdate = !0, dimState.focus = null, dimState.scale.setFishEye(null), dimState.scale.commit()); })), needUpdate && this.view.run(); } shouldHandle(e) { var _a, _b, _c; return this._marks ? e.element && this._marks && this._marks.includes(e.element.mark) : e.target === (null === (_c = null === (_b = null === (_a = this.view) || void 0 === _a ? void 0 : _a.renderer) || void 0 === _b ? void 0 : _b.stage) || void 0 === _c ? void 0 : _c.call(_b)); } shouldUpdate(e) { if (this._marks) return e.element && this._marks && this._marks.includes(e.element.mark); const viewBox = this.view.getViewBox(); return e.canvasX >= viewBox.x1 && e.canvasX <= viewBox.x2 && e.canvasY >= viewBox.y1 && e.canvasY <= viewBox.y2; } unbind() { super.unbind(), this._state && Object.keys(this._state).forEach((dim => { const {scale: scale} = this._state[dim]; scale && (scale.setRangeFactor(null), scale.commit()); })), this._state = null; } } exports.FishEye = FishEye, FishEye.type = "fish-eye", FishEye.defaultOptions = { trigger: "pointerenter", updateTrigger: "pointermove", endTrigger: "pointerleave", distortionX: 2, distortionY: 2, throttle: 100 }; //# sourceMappingURL=fish-eye.js.map