@visactor/vtable
Version:
canvas table width high performance
97 lines (91 loc) • 5.63 kB
JavaScript
import { cloneDeep, get, merge } from "@visactor/vutils";
import { ColorContinuousLegend, SizeContinuousLegend } from "./../../../vrender";
import { getContinuousLegendAttributes } from "./get-continue-legend-attributes";
import { TABLE_EVENT_TYPE } from "../../../core/TABLE_EVENT_TYPE";
import { getQuadProps } from "../../../scenegraph/utils/padding";
export class ContinueTableLegend {
constructor(option, table) {
var _a, _b, _c, _d;
this.table = table, this.option = cloneDeep(option), this.orient = null !== (_a = option.orient) && void 0 !== _a ? _a : "left",
this.visible = null === (_b = option.visible) || void 0 === _b || _b, this.position = null !== (_c = option.position) && void 0 !== _c ? _c : "middle",
this.selectedData = null !== (_d = option.defaultSelected) && void 0 !== _d ? _d : null,
this.createComponent(), this.initEvent();
}
createComponent() {
const attrs = this.getLegendAttributes({
width: this.table.tableNoFrameWidth,
height: this.table.tableNoFrameHeight
});
let legend;
legend = "color" === this.option.type ? new ColorContinuousLegend(merge({}, attrs, {
slidable: !0
})) : new SizeContinuousLegend(merge({}, attrs, {
slidable: !0
})), legend.name = "legend", this.legendComponent = legend, !1 === this.visible && (legend.setAttributes({
visible: !1,
visibleAll: !1
}), legend.hideAll()), this.table.scenegraph.stage.defaultLayer.appendChild(legend),
this.adjustTableSize(attrs);
}
resize() {
this.legendComponent && !1 !== this.visible && (this.legendComponent.setAttributes({
width: this.table.tableNoFrameWidth,
height: this.table.tableNoFrameHeight
}), this.adjustTableSize(this.legendComponent.attribute));
}
adjustTableSize(attrs) {
var _a, _b;
if (!this.legendComponent || !1 === this.visible) return;
let width = isFinite(this.legendComponent.AABBBounds.width()) ? this.legendComponent.AABBBounds.width() : 0, height = isFinite(this.legendComponent.AABBBounds.height()) ? this.legendComponent.AABBBounds.height() : 0;
if (width <= 0 || height <= 0) return;
const rectWidth = this.table.tableNoFrameWidth, rectHeight = this.table.tableNoFrameHeight, padding = getQuadProps(null !== (_b = null !== (_a = attrs.padding) && void 0 !== _a ? _a : this.option.padding) && void 0 !== _b ? _b : 10);
let x = 0, y = 0;
"left" === this.orient ? (x = padding[3], y = 0, width += padding[1] + padding[3]) : "top" === this.orient ? (x = 0,
y = padding[0], height += padding[0] + padding[2]) : "right" === this.orient ? (x = rectWidth - width - padding[1],
y = 0, width += padding[1] + padding[3]) : "bottom" === this.orient && (x = 0, y = rectHeight - height - padding[2],
height += padding[0] + padding[2]);
const layout = "bottom" === this.orient || "top" === this.orient ? "horizontal" : "vertical", position = this.position;
let offsetX = 0, offsetY = 0;
"horizontal" === layout ? offsetX = "middle" === position ? (rectWidth - width) / 2 : "end" === position ? rectWidth - width - padding[1] : padding[3] : offsetY = "middle" === position ? (rectHeight - height) / 2 : "end" === position ? rectHeight - height - padding[2] : padding[0],
this.legendComponent.setAttributes({
dx: offsetX,
dy: offsetY,
x: x,
y: y
}), "left" === this.orient ? (this.table.tableNoFrameWidth = this.table.tableNoFrameWidth - Math.ceil(width),
this.table.tableX += Math.ceil(width)) : "top" === this.orient ? (this.table.tableNoFrameHeight = this.table.tableNoFrameHeight - Math.ceil(height),
this.table.tableY += Math.ceil(height)) : "right" === this.orient ? this.table.tableNoFrameWidth = this.table.tableNoFrameWidth - Math.ceil(width) : "bottom" === this.orient && (this.table.tableNoFrameHeight = this.table.tableNoFrameHeight - Math.ceil(height));
}
getLegendAttributes(rect) {
const layout = "bottom" === this.orient || "top" === this.orient ? "horizontal" : "vertical", align = "horizontal" === layout ? "bottom" : this.orient;
return Object.assign(Object.assign({}, getContinuousLegendAttributes(this.option, rect)), {
layout: layout,
align: align,
min: this.option.min,
max: this.option.max,
value: this.option.value,
["color" === this.option.type ? "colors" : "sizeRange"]: "color" === this.option.type ? this.option.colors : this.option.sizeRange
});
}
initEvent() {
this.legendComponent && this.legendComponent.addEventListener("change", (e => {
const selectedData = get(e, "detail.value");
this.table.fireListeners(TABLE_EVENT_TYPE.LEGEND_CHANGE, {
model: this,
value: selectedData,
event: e
}), this.table.scenegraph.updateNextFrame();
}));
}
getLegendBounds() {
return {
width: isFinite(this.legendComponent.AABBBounds.width()) ? this.legendComponent.AABBBounds.width() : 0,
height: isFinite(this.legendComponent.AABBBounds.height()) ? this.legendComponent.AABBBounds.height() : 0
};
}
release() {
this.legendComponent && this.table.scenegraph.stage.defaultLayer.removeChild(this.legendComponent),
this.legendComponent = null;
}
}
//# sourceMappingURL=continue-legend.js.map