@visactor/vrender-components
Version:
components library for dp visualization
105 lines (99 loc) • 4.49 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.SizeContinuousLegend = void 0;
const vrender_core_1 = require("@visactor/vrender-core"), vutils_1 = require("@visactor/vutils"), base_1 = require("../base"), slider_1 = require("../../slider"), constant_1 = require("../constant"), util_1 = require("../util"), register_1 = require("../register");
(0, register_1.loadSizeContinuousLegendComponent)();
class SizeContinuousLegend extends base_1.LegendBase {
constructor(attributes, options) {
super((null == options ? void 0 : options.skipDefault) ? attributes : (0, vutils_1.merge)({}, SizeContinuousLegend.defaultAttributes, attributes)),
this.name = "sizeLegend", this._onSliderChange = e => {
this.dispatchEvent(e);
}, this._onSliderToolipChange = e => {
this.dispatchEvent(e);
};
}
setSelected(value) {
this._slider && this._slider.setValue(value);
}
_renderContent() {
const {slidable: slidable, layout: layout, align: align, min: min, max: max, value: value, railWidth: railWidth, railHeight: railHeight, showHandler: showHandler = !0, handlerSize: handlerSize, handlerStyle: handlerStyle, railStyle: railStyle, trackStyle: trackStyle, startText: startText, endText: endText, handlerText: handlerText, showTooltip: showTooltip, tooltip: tooltip, sizeBackground: sizeBackground, disableTriggerEvent: disableTriggerEvent, inverse: inverse} = this.attribute, mainContainer = vrender_core_1.graphicCreator.group({
x: 0,
y: 0
});
this._innerView.add(mainContainer);
const slider = new slider_1.Slider({
x: 0,
y: 0,
zIndex: 1,
range: {
draggableTrack: !0
},
slidable: slidable,
layout: layout,
align: align,
min: min,
max: max,
value: value,
railWidth: railWidth,
railHeight: railHeight,
showHandler: showHandler,
handlerSize: handlerSize,
handlerStyle: Object.assign({
symbolType: (0, util_1.getSizeHandlerPath)(align)
}, handlerStyle),
railStyle: railStyle,
trackStyle: trackStyle,
startText: startText,
endText: endText,
handlerText: handlerText,
showTooltip: showTooltip,
tooltip: tooltip,
disableTriggerEvent: disableTriggerEvent,
inverse: inverse
});
mainContainer.add(slider);
let path, start = 0;
"horizontal" === layout ? "top" === align ? (path = `M0,0L${railWidth},0L${inverse ? 0 : railWidth},12Z`,
start = railHeight) : (path = `M0,12L${railWidth},12L${inverse ? 0 : railWidth},0Z`,
slider.setAttribute("y", 12)) : "left" === align ? path = `M${railWidth},0L${railWidth + 12},${inverse ? 0 : railHeight}L${railWidth},${railHeight}Z` : (path = `M0,${inverse ? 0 : railHeight}L12,${railHeight}L12,0Z`,
slider.setAttribute("x", 12));
const background = vrender_core_1.graphicCreator.path(Object.assign(Object.assign({
x: 0,
y: start,
path: path
}, sizeBackground), {
zIndex: 0
}));
mainContainer.add(background);
const titleSpace = this._title ? this._title.AABBBounds.height() + (0, vutils_1.get)(this.attribute, "title.space", constant_1.DEFAULT_TITLE_SPACE) : 0;
mainContainer.translate(0 - mainContainer.AABBBounds.x1, titleSpace - mainContainer.AABBBounds.y1),
this._slider = slider;
}
_bindEvents() {
this.attribute.disableTriggerEvent || this._slider && (this._slider.addEventListener("change", this._onSliderChange),
this._slider.addEventListener("sliderTooltip", this._onSliderToolipChange));
}
}
exports.SizeContinuousLegend = SizeContinuousLegend, SizeContinuousLegend.defaultAttributes = {
layout: "horizontal",
title: {
align: "start",
space: constant_1.DEFAULT_TITLE_SPACE,
textStyle: {
fontSize: 12,
fontWeight: "bold",
fill: "rgba(46, 47, 50, 1)"
}
},
handlerSize: 10,
handlerStyle: {
lineWidth: 1,
stroke: "#ccc",
fill: "#fff"
},
sizeBackground: {
fill: "rgba(20,20,20,0.1)"
}
};
//# sourceMappingURL=size.js.map