@visactor/vtable
Version:
canvas table width high performance
116 lines (111 loc) • 6.77 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.DiscreteTableLegend = void 0;
const vutils_1 = require("@visactor/vutils"), vrender_1 = require("./../../../vrender"), get_discrete_legend_attributes_1 = require("./get-discrete-legend-attributes"), TABLE_EVENT_TYPE_1 = require("../../../core/TABLE_EVENT_TYPE"), padding_1 = require("../../../scenegraph/utils/padding");
class DiscreteTableLegend {
constructor(option, table) {
var _a, _b, _c, _d;
this.table = table, this.option = (0, vutils_1.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
}), legend = new vrender_1.DiscreteLegend((0, vutils_1.merge)({}, attrs, {
defaultSelected: this.selectedData,
disableTriggerEvent: this.table.options.disableInteraction
}));
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({
maxWidth: this.table.tableNoFrameWidth,
maxHeight: 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 = (0,
padding_1.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) {
var _a, _b;
const layout = "bottom" === this.orient || "top" === this.orient ? "horizontal" : "vertical", legendAttrs = (0,
get_discrete_legend_attributes_1.getLegendAttributes)(this.option, rect), padding = (0,
padding_1.getQuadProps)(null !== (_b = null !== (_a = legendAttrs.padding) && void 0 !== _a ? _a : this.option.padding) && void 0 !== _b ? _b : 10);
return Object.assign({
layout: layout,
items: this.getLegendItems(),
maxWidth: rect.width - padding[1] - padding[3],
maxHeight: rect.height - padding[0] - padding[2]
}, legendAttrs);
}
getLegendItems() {
return this.option.data;
}
initEvent() {
this.legendComponent && (this.legendComponent.addEventListener(vrender_1.LegendEvent.legendItemClick, (e => {
const selectedData = (0, vutils_1.get)(e, "detail.currentSelected");
this.table.fireListeners(TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE.LEGEND_ITEM_CLICK, {
model: this,
value: selectedData,
event: e
});
})), this.legendComponent.addEventListener(vrender_1.LegendEvent.legendItemHover, (e => {
const detail = (0, vutils_1.get)(e, "detail");
this.table.fireListeners(TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE.LEGEND_ITEM_HOVER, {
model: this,
value: detail,
event: e
});
})), this.legendComponent.addEventListener(vrender_1.LegendEvent.legendItemUnHover, (e => {
const detail = (0, vutils_1.get)(e, "detail");
this.table.fireListeners(TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE.LEGEND_ITEM_UNHOVER, {
model: this,
value: detail,
event: e
});
})), this.legendComponent.addEventListener("legendItemAttributeUpdate", (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;
}
}
exports.DiscreteTableLegend = DiscreteTableLegend;
//# sourceMappingURL=discrete-legend.js.map