@visactor/vchart
Version:
charts lib based @visactor/VGrammar
118 lines (111 loc) • 6.56 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.registerScrollBar = exports.ScrollBar = void 0;
const vutils_1 = require("@visactor/vutils"), type_1 = require("../../interface/type"), data_filter_base_component_1 = require("../data-filter-base-component"), vrender_components_1 = require("@visactor/vrender-components"), style_1 = require("../../../util/style"), layout_1 = require("../../../constant/layout"), event_1 = require("../../../constant/event"), scroll_bar_1 = require("../../../constant/scroll-bar"), factory_1 = require("../../../core/factory"), util_1 = require("../../../util"), scroll_bar_2 = require("../../../theme/builtin/common/component/scroll-bar"), SCROLLBAR_EVENT = "scrollDrag", SCROLLBAR_END_EVENT = "scrollUp";
class ScrollBar extends data_filter_base_component_1.DataFilterBaseComponent {
constructor(spec, options) {
var _a;
super(spec, options), this.type = type_1.ComponentTypeEnum.scrollBar, this.name = type_1.ComponentTypeEnum.scrollBar,
this.specKey = "scrollBar", this.layoutZIndex = layout_1.LayoutZIndex.DataZoom,
this.layoutLevel = layout_1.LayoutLevel.DataZoom, this.layoutType = "region-relative",
this._filterMode = null !== (_a = spec.filterMode) && void 0 !== _a ? _a : "axis";
}
setAttrFromSpec() {
super.setAttrFromSpec(), (0, vutils_1.isBoolean)(this._spec.roam) && (this._zoomAttr.enable = !1,
this._dragAttr.enable = this._spec.roam, this._scrollAttr.enable = this._spec.roam),
(this._zoomAttr.enable || this._dragAttr.enable || this._scrollAttr.enable) && this.initZoomable(this.event, this._option.mode);
}
onLayoutEnd() {
var _a, _b;
this._updateScaleRange(), null === (_b = (_a = this.effect).onZoomChange) || void 0 === _b || _b.call(_a),
super.onLayoutEnd();
}
_updateScaleRange() {
this._component && this._component.setAttributes({
x: this.getLayoutStartPoint().x,
y: this.getLayoutStartPoint().y,
width: this.getLayoutRect().width,
height: this.getLayoutRect().height
});
}
_computeWidth() {
return (0, vutils_1.isNumber)(this._spec.width) ? this._spec.width : this._isHorizontal ? this.getLayoutRect().width : scroll_bar_1.SCROLL_BAR_DEFAULT_SIZE;
}
_computeHeight() {
return (0, vutils_1.isNumber)(this._spec.height) ? this._spec.height : this._isHorizontal ? scroll_bar_1.SCROLL_BAR_DEFAULT_SIZE : this.getLayoutRect().height;
}
_getAttrs() {
var _a, _b, _c, _d, _e, _f;
return Object.assign({
zIndex: this.layoutZIndex,
x: this.getLayoutStartPoint().x,
y: this.getLayoutStartPoint().y,
width: this.getLayoutRect().width,
height: this.getLayoutRect().height,
range: [ this._start, this._end ],
direction: this._isHorizontal ? "horizontal" : "vertical",
delayType: null === (_a = this._spec) || void 0 === _a ? void 0 : _a.delayType,
delayTime: (0, vutils_1.isValid)(null === (_b = this._spec) || void 0 === _b ? void 0 : _b.delayType) ? null !== (_d = null === (_c = this._spec) || void 0 === _c ? void 0 : _c.delayTime) && void 0 !== _d ? _d : 30 : 0,
realTime: null === (_f = null === (_e = this._spec) || void 0 === _e ? void 0 : _e.realTime) || void 0 === _f || _f
}, this._getComponentAttrs());
}
_createOrUpdateComponent() {
const attrs = this._getAttrs();
if (this._component) this._component.setAttributes(attrs); else {
const container = this.getContainer();
this._component = new vrender_components_1.ScrollBar(attrs), this._component.addEventListener("scrollDrag", (e => {
const value = e.detail.value;
this._handleChange(value[0], value[1]);
})), this._component.addEventListener("scrollUp", (e => {
const value = e.detail.value;
this._handleChange(value[0], value[1]);
})), container.add(this._component);
}
}
_handleChange(start, end, updateComponent) {
super._handleChange(start, end, updateComponent);
const isSameScrollValue = (0, util_1.isClose)(this._start, start) && (0, util_1.isClose)(this._end, end);
if (this._shouldChange && (!isSameScrollValue || !1 === this._spec.realTime)) {
updateComponent && this._component && this._component.setAttribute("range", [ start, end ]),
this._start = start, this._end = end;
const startValue = this.statePointToData(start), endValue = this.statePointToData(end);
((0, vutils_1.isFunction)(this._spec.updateDataAfterChange) ? this._spec.updateDataAfterChange(start, end, startValue, endValue) : this._handleStateChange(this.statePointToData(start), this.statePointToData(end))) && this.event.emit(event_1.ChartEvent.scrollBarChange, {
model: this,
value: {
filterData: "axis" !== this._filterMode,
start: this._start,
end: this._end,
startValue: this._startValue,
endValue: this._endValue,
newDomain: this._newDomain
}
});
}
}
_handleDataCollectionChange() {
if (this._spec.auto) {
this._data.getDataView().reRunAllTransform();
}
}
_getComponentAttrs() {
const {rail: rail, slider: slider, innerPadding: innerPadding} = this._spec, attrs = {};
return (0, vutils_1.isNil)(innerPadding) || (attrs.padding = innerPadding), (0,
vutils_1.isEmpty)(null == rail ? void 0 : rail.style) || (attrs.railStyle = (0,
style_1.transformToGraphic)(rail.style)), (0, vutils_1.isEmpty)(null == slider ? void 0 : slider.style) || (attrs.sliderStyle = (0,
style_1.transformToGraphic)(slider.style)), attrs.disableTriggerEvent = this._option.disableTriggerEvent,
attrs;
}
_getNeedClearVRenderComponents() {
return [ this._component ];
}
}
exports.ScrollBar = ScrollBar, ScrollBar.type = type_1.ComponentTypeEnum.scrollBar,
ScrollBar.builtInTheme = {
scrollBar: scroll_bar_2.scrollBar
}, ScrollBar.specKey = "scrollBar";
const registerScrollBar = () => {
factory_1.Factory.registerComponent(ScrollBar.type, ScrollBar);
};
exports.registerScrollBar = registerScrollBar;
//# sourceMappingURL=scroll-bar.js.map