@aloudata/ink-lineage 0.0.3-beta.8 → 0.0.4-beta.1

package/dist/manager/LineageManager.js

@@ -1,29 +1,29 @@
 import { __assign, __read, __spreadArray } from "tslib";
-import { BigLayout, Graph, isNodeVisible, } from '@aloudata/ink-graph-new';
-import { TableDataProcessor, ExpandManager, TaskGraphEventManager, } from './index';
+import { BigLayout, Graph, LifeCycleEvent, } from '@aloudata/ink-graph-new';
+import { TableDataProcessor, ExpandManager, TaskGraphEventManager, ScheduleDataProcessor, TaskDataProcessor, } from './index';
 import { EDashType, EDirection, ELineageType, EGraphMode, EEventEnum, } from '../types';
 import { getRelatedData, getTaskRelatedData } from '../utils';
 import { SearchNodeManager, TableRightKeyMenuManager, FoldLineageManager, } from '.';
 import _ from 'lodash';
 import { ToolbarManager } from './ToolbarManager';
 import EventEmitter from 'eventemitter3';
-import { CustomNode, TableNode, DefaultEdge, } from '../components';
+import { CustomNode, TableNode, DefaultEdge, ColumnNode, TaskColumnNode, } from '../components';
 import { DefaultNode } from '../components/Nodes/DefaultNode';
 import { CustomEventManager, TableEventManager, ColumnEventManager, } from './nodeManager';
-import { CUSTOM_NODE, BASE_NODE, FOLD_EDGE, LINEAGE_EDGE, TABLE_NODE, BASE_EDGE, TASK_TABLE_NODE, TASK_TABLE_WIDTH, } from '../constant';
+import { CUSTOM_NODE, BASE_NODE, FOLD_EDGE, LINEAGE_EDGE, TABLE_NODE, BASE_EDGE, TASK_TABLE_NODE, TASK_TABLE_WIDTH, SCHEDULE_TASK_TABLE_NODE, CLICK_EDGE, } from '../constant';
 import { FoldEdge } from '../components/Edges/FoldEdge';
 import { LineageEdge } from '../components/Edges/LineageEdge';
-import { mat3ToMat4 } from '../utils/matrix';
-import { TableGraphEventManager } from './TableGraphEventManager';
-import { hideEdgeTypes, onZoomChange, updateColumnPosition, updateNodeHeight, } from '../utils/manager';
+import { TableGraphEventManager } from './graphEventManager/TableGraphEventManager';
+import { onZoomChange, updateColumnPosition, updateNodeHeight, } from '../utils/manager';
 import { TaskTableNode } from '../components/Nodes/Task/TaskTableNode';
 import { TaskTableEventManager } from './nodeManager/task/TaskTableEventManager';
 import { TaskColumnEventManager } from './nodeManager/task/TaskColumnEventManager';
-import { TaskDataProcessor } from './TaskDataProcessor';
-import { TaskRightKeyMenuManager } from './TaskRightKeyMenuManager';
-import { mat4 } from 'gl-matrix';
+import { TaskRightKeyMenuManager } from './rightKeyMenu/TaskRightKeyMenuManager';
 import { BigDagre } from '../BigDagre';
 import { AssetBaseNode } from '../components/Nodes/Table/AssetBaseNode';
+import { ScheduleTaskTableNode } from '../components/Nodes/ScheduleTaskTableNode';
+import { ScheduleTaskTableEventManager } from './nodeManager/ScheduleTaskTableEventManager';
+import { ClickEdge } from '../components/Edges/ClickEdge';
 var InkLineageManager = /** @class */ (function () {
     function InkLineageManager(data, config) {
         this.emitter = new EventEmitter();
@@ -49,7 +49,7 @@ var InkLineageManager = /** @class */ (function () {
         this.initManagers();
         this.initGraph();
         this.graphEventManager.init();
-        if (this.config.lineageType === ELineageType.TABLE) {
+        if ([ELineageType.TABLE, ELineageType.SCHEDULE].includes(this.config.lineageType)) {
             this.expandManager.init();
         }
     }
@@ -74,17 +74,23 @@ var InkLineageManager = /** @class */ (function () {
             this.toolbarManager = new ToolbarManager(this);
             this.expandManager = new ExpandManager(this);
         }
-        else {
+        else if (this.config.lineageType === ELineageType.TASK) {
             this.tableEventManager = new TaskTableEventManager(this);
             this.columnEventManager = new TaskColumnEventManager(this);
             this.graphEventManager = new TaskGraphEventManager(this);
             this.dataProcessor = new TaskDataProcessor(this);
             this.rightKeyMenuManager = new TaskRightKeyMenuManager(this);
         }
+        else {
+            this.scheduleTaskTableEventManager = new ScheduleTaskTableEventManager(this);
+            this.graphEventManager = new TableGraphEventManager(this);
+            this.dataProcessor = new ScheduleDataProcessor(this);
+            this.rightKeyMenuManager = new TaskRightKeyMenuManager(this);
+            this.expandManager = new ExpandManager(this);
+        }
     };
     InkLineageManager.prototype.initGraph = function () {
         var _this = this;
-        // init graph by parsed data
         var _a = this.config, root = _a.root, cullingConfig = _a.cullingConfig, layoutConfig = _a.layoutConfig, zoomConfig = _a.zoomConfig, fontList = _a.fontList;
         var graph = new Graph({
             root: root,
@@ -105,6 +111,47 @@ var InkLineageManager = /** @class */ (function () {
                     },
                 },
             },
+            // canvasCallback: {
+            //   onDrop: () => {
+            //     if (
+            //       this.config?.cullingConfig?.auto &&
+            //       this.parsedData.nodes.length > this.config?.cullingConfig?.max
+            //     ) {
+            //       this.update({ shouldGroupNodes: false });
+            //     }
+            //   },
+            //   onWheel: () => {
+            //     if (
+            //       this.config?.cullingConfig?.auto &&
+            //       this.parsedData.nodes.length > this.config?.cullingConfig?.max
+            //     ) {
+            //       this.update({ shouldGroupNodes: false });
+            //     }
+            //   },
+            // },
+            canvasOptions: {
+                interactions: {
+                    maxZoom: (zoomConfig === null || zoomConfig === void 0 ? void 0 : zoomConfig.max) || 4.5,
+                    minZoom: (zoomConfig === null || zoomConfig === void 0 ? void 0 : zoomConfig.min) || 0.1,
+                },
+            },
+        });
+        graph.canvas.on(LifeCycleEvent.TRANSFORM_CHANGE, function () {
+            var mode = graph.mode;
+            var zoom = graph.canvas.getZoom();
+            if (mode === 'SIMPLE' && zoom > 0.5) {
+                graph.mode = 'NORMAL';
+            }
+            else if (mode === 'NORMAL' && zoom < 0.5) {
+                graph.mode = 'SIMPLE';
+            }
+            else {
+                return;
+            }
+            // mode变化时更新
+            if (_this.config.lineageType === ELineageType.TABLE) {
+                onZoomChange(mode, _this);
+            }
         });
         this.graph = graph;
         // register custom node
@@ -118,10 +165,24 @@ var InkLineageManager = /** @class */ (function () {
         graph.registerNode(TABLE_NODE, TableNode);
         graph.registerNode(TASK_TABLE_NODE, TaskTableNode);
         graph.registerNode(CUSTOM_NODE, CustomNode);
+        graph.registerNode(SCHEDULE_TASK_TABLE_NODE, ScheduleTaskTableNode);
         graph.registerEdge(FOLD_EDGE, FoldEdge);
         graph.registerEdge(LINEAGE_EDGE, LineageEdge);
+        graph.registerEdge(CLICK_EDGE, ClickEdge);
         DefaultNode.lineageManager = this;
         DefaultEdge.lineageManager = this;
+        if (this.config.lineageType === ELineageType.TASK) {
+            TaskTableNode.lineageManager = this;
+            TaskColumnNode.lineageManager = this;
+        }
+        else if (this.config.lineageType === ELineageType.SCHEDULE) {
+            ScheduleTaskTableNode.lineageManager = this;
+        }
+        else {
+            TableNode.lineageManager = this;
+            CustomNode.lineageManager = this;
+            ColumnNode.lineageManager = this;
+        }
         graph.canvas.whenReady().then(function () { return _this.render(false, true); });
     };
     InkLineageManager.prototype.on = function (type, listener) {
@@ -185,30 +246,29 @@ var InkLineageManager = /** @class */ (function () {
         this.update();
     };
     InkLineageManager.prototype.render = function (isUpdate, isInit) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         if (isUpdate === void 0) { isUpdate = false; }
         if (!this.parsedData)
             return;
-        if (this.config.lineageType === ELineageType.TABLE) {
-            this.refreshExtraStatus();
-        }
-        else {
-            this.taskRefreshExtraStatus();
-        }
+        this.refreshExtraStatus();
         if (this.layoutControl.shouldLayout) {
-            var _c = this.parsedData, nodes = _c.nodes, edges = _c.edges;
+            var _e = this.parsedData, nodes = _e.nodes, edges = _e.edges;
             var visibleNodes = nodes.filter(function (node) { return node.visible; });
             var visibleEdges = edges.filter(function (edge) { return edge.visible; });
             var layoutData = this.layout(visibleNodes, visibleEdges);
-            // TODO: 启用裁剪
-            // const data = this.handleCulling(layoutData);
-            this.graph.setData(layoutData);
+            // this.updateDataMaps(layoutData); // 布局完之后的节点需要更新到map中，这样节点才有偏移，合并链路才符合预期
+            var data = this.handleCulling(layoutData);
+            this.graph.setData(data);
+        }
+        // 表血缘有环的情况下，icon的显隐判断，需要根据坐标判断
+        if (this.config.lineageType === ELineageType.TABLE) {
+            (_b = (_a = this.dataProcessor) === null || _a === void 0 ? void 0 : _a.updateSideIconVisible) === null || _b === void 0 ? void 0 : _b.call(_a, this.parsedData);
         }
         if (isUpdate) {
-            (_a = this.graph) === null || _a === void 0 ? void 0 : _a.update();
+            (_c = this.graph) === null || _c === void 0 ? void 0 : _c.update();
         }
         else {
-            (_b = this.graph) === null || _b === void 0 ? void 0 : _b.render();
+            (_d = this.graph) === null || _d === void 0 ? void 0 : _d.render();
         }
         if (this.config.lineageType === ELineageType.TASK && isInit) {
             this.taskTranslate();
@@ -216,30 +276,39 @@ var InkLineageManager = /** @class */ (function () {
         this.resetLayoutControl();
     };
     InkLineageManager.prototype.taskTranslate = function () {
-        var _this = this;
-        var _a, _b, _c, _d, _e, _f;
-        var rightNode = '';
-        (_b = (_a = this.graph) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.forEach(function (node) {
-            var _a, _b, _c, _d;
-            if (!node.config.visible)
-                return;
-            var target = node.bgGroup;
-            var x = target.getPosition().x;
-            var curRightNodeX = (_d = (_c = (_b = (_a = _this.graph.nodes) === null || _a === void 0 ? void 0 : _a.get(rightNode)) === null || _b === void 0 ? void 0 : _b.getPosition) === null || _c === void 0 ? void 0 : _c.call(_b)) === null || _d === void 0 ? void 0 : _d.x;
-            if (rightNode === '' || x > curRightNodeX)
-                rightNode = node === null || node === void 0 ? void 0 : node.id;
+        var _a;
+        if (!((_a = this.graph) === null || _a === void 0 ? void 0 : _a.nodes))
+            return;
+        // 找到最右边的节点
+        var rightmostNode = null;
+        var rightmostX = -Infinity;
+        this.graph.nodes.forEach(function (node) {
+            if (node.container && node.config.visible) {
+                var bbox_1 = node.container.getBoundingRect();
+                if (bbox_1.width > 0 && bbox_1.height > 0) {
+                    var nodeRightX = bbox_1.x + bbox_1.width;
+                    if (nodeRightX > rightmostX) {
+                        rightmostX = nodeRightX;
+                        rightmostNode = node;
+                    }
+                }
+            }
         });
-        if (!rightNode)
+        if (!rightmostNode)
             return;
-        var canvasW = (_c = this.graph) === null || _c === void 0 ? void 0 : _c.getWidth();
-        var canvasH = (_d = this.graph) === null || _d === void 0 ? void 0 : _d.getHeight();
-        var target = (_e = this.graph.nodes) === null || _e === void 0 ? void 0 : _e.get(rightNode);
-        var _g = target.getPosition(), x = _g.x, y = _g.y;
-        var _h = target.getBBox(), height = _h.height, width = _h.width;
-        var innerWidth = window.innerWidth, innerHeight = window.innerHeight;
-        var offsetX = (-200 * innerWidth) / 1920;
-        var offsetY = (100 * innerHeight) / 1080;
-        (_f = this.graph) === null || _f === void 0 ? void 0 : _f.translate(x - canvasW / 2 + width / 2 + offsetX, y - canvasH / 2 + height / 2 + offsetY);
+        // 获取最右边节点的边界
+        var bbox = rightmostNode.container.getBoundingRect();
+        var nodeCenterX = bbox.x + bbox.width / 2; // 节点中心 X
+        var nodeCenterY = bbox.y + bbox.height / 2; // 节点中心 Y
+        // 获取画布尺寸
+        var canvasSize = this.graph.canvas.getSize();
+        var canvasCenterX = canvasSize.width * 0.5;
+        var canvasCenterY = canvasSize.height * 0.5;
+        // 计算需要的相机偏移（最右侧节点的位置要稍微偏右上方）
+        var cameraOffsetX = canvasCenterX - nodeCenterX * 0.9;
+        var cameraOffsetY = canvasCenterY - nodeCenterY * 1.2;
+        // 设置相机位置
+        this.translateCanvas(cameraOffsetX, cameraOffsetY);
     };
     InkLineageManager.prototype.update = function (layoutControl) {
         if (layoutControl) {
@@ -259,16 +328,18 @@ var InkLineageManager = /** @class */ (function () {
         this.graph = null;
     };
     InkLineageManager.prototype.setData = function (data) {
-        if (this.getMode() === 'SIMPLE' &&
-            this.config.lineageType === ELineageType.TABLE) {
-            data.edges.forEach(function (edge) {
-                if (hideEdgeTypes.includes(edge.data.relationTypeCode)) {
-                    edge.visible = false;
-                    edge.canBeFold = true;
-                    edge.isFolded = true;
-                }
-            });
-        }
+        // if (
+        //   this.getMode() === 'SIMPLE' &&
+        //   this.config.lineageType === ELineageType.TABLE
+        // ) {
+        //   data.edges.forEach((edge) => {
+        //     if (hideEdgeTypes.includes(edge.data.relationTypeCode)) {
+        //       edge.visible = false;
+        //       edge.canBeFold = true;
+        //       edge.isFolded = true;
+        //     }
+        //   });
+        // }
         this.parsedData = data;
         this.updateDataMaps(this.parsedData);
     };
@@ -278,51 +349,70 @@ var InkLineageManager = /** @class */ (function () {
     };
     // 裁剪逻辑
     InkLineageManager.prototype.handleCulling = function (data) {
-        var _this = this;
-        var _a, _b;
-        var _c = ((_a = this.config) === null || _a === void 0 ? void 0 : _a.cullingConfig) || { auto: false, max: 0 }, auto = _c.auto, max = _c.max;
-        var culling = auto && this.parsedData.nodes.length > max;
-        var nodesConfig = data.nodes;
-        var edgesConfig = data.edges;
-        if (culling) {
-            // TODO: 节点裁剪逻辑优化
-            var orthoMatrix_1 = this.getCanvas()
-                .getContext()
-                .cameraManager.getTransform()
-                .getLocalMatrix();
-            // set nodes & edges
-            var nodesConfigMap_1 = new Map();
-            nodesConfig = (_b = data === null || data === void 0 ? void 0 : data.nodes) === null || _b === void 0 ? void 0 : _b.filter(function (node) {
-                var isVisible = isNodeVisible(node, _this.canvasDomRoot.clientWidth, _this.canvasDomRoot.clientHeight, mat3ToMat4(mat4.create(), orthoMatrix_1));
-                if (isVisible) {
-                    nodesConfigMap_1.set(node.id, node);
-                }
-                return isVisible;
-            });
-        }
-        return {
-            nodes: nodesConfig,
-            edges: edgesConfig,
-        };
+        // const { auto, max } = this.config?.cullingConfig || { auto: false, max: 0 };
+        // const culling = auto && this.parsedData.nodes.length > max;
+        // let nodesConfig = data.nodes;
+        // let edgesConfig = data.edges;
+        // if (culling) {
+        //   const orthoMatrix = this.getCanvas().getCamera().getOrthoMatrix();
+        //   // set nodes & edges
+        //   const nodesConfigMap = new Map<
+        //     string,
+        //     INodeConfig<TTableData, TColumnData>
+        //   >();
+        //   nodesConfig = data?.nodes?.filter((node) => {
+        //     const isVisible = isNodeVisible(
+        //       node,
+        //       this.canvasDomRoot.clientWidth,
+        //       this.canvasDomRoot.clientHeight,
+        //       orthoMatrix,
+        //     );
+        //     if (isVisible) {
+        //       nodesConfigMap.set(node.id, node);
+        //     }
+        //     return isVisible;
+        //   });
+        // }
+        // return {
+        //   nodes: nodesConfig,
+        //   edges: edgesConfig,
+        // };
+        return data;
+    };
+    InkLineageManager.prototype.scheduleRefreshExtraStatus = function () {
+        var _a, _b, _c;
+        (_a = this.dataProcessor) === null || _a === void 0 ? void 0 : _a.updateNodesAndEdgesVisible(this.parsedData);
+        (_b = this.dataProcessor) === null || _b === void 0 ? void 0 : _b.refreshRelatedNodesAndEdges(this.relatedNodes, this.relatedEdges);
+        (_c = this.dataProcessor) === null || _c === void 0 ? void 0 : _c.updateSideIconVisible(this.parsedData);
     };
     InkLineageManager.prototype.taskRefreshExtraStatus = function () {
         var _a, _b, _c, _d, _e;
+        (_a = this.dataProcessor) === null || _a === void 0 ? void 0 : _a.updateNodesAndEdgesVisible(this.parsedData, (_b = this.rightKeyMenuManager) === null || _b === void 0 ? void 0 : _b.edgeDashVisible, (_c = this.rightKeyMenuManager) === null || _c === void 0 ? void 0 : _c.onlyShowRelated);
         // 刷新相关节点和边的高亮样式（如果打开了间接血缘按钮，那这些间接血缘也需要高亮）
-        if (((_a = this.rightKeyMenuManager) === null || _a === void 0 ? void 0 : _a.exploreState.mode) === EGraphMode.NORMAL) {
-            (_b = this.dataProcessor) === null || _b === void 0 ? void 0 : _b.refreshRelatedNodesAndEdges(this.relatedNodes, this.relatedEdges);
+        if (((_d = this.rightKeyMenuManager) === null || _d === void 0 ? void 0 : _d.exploreState.mode) === EGraphMode.NORMAL) {
+            (_e = this.dataProcessor) === null || _e === void 0 ? void 0 : _e.refreshRelatedNodesAndEdges(this.relatedNodes, this.relatedEdges);
         }
-        (_c = this.dataProcessor) === null || _c === void 0 ? void 0 : _c.updateNodesAndEdgesVisible(this.parsedData, (_d = this.rightKeyMenuManager) === null || _d === void 0 ? void 0 : _d.edgeDashVisible, (_e = this.rightKeyMenuManager) === null || _e === void 0 ? void 0 : _e.onlyShowRelated);
         updateNodeHeight(this.parsedData);
         updateColumnPosition(this.parsedData);
     };
     InkLineageManager.prototype.refreshExtraStatus = function () {
-        var _a, _b, _c, _d, _e, _f;
-        // 刷新相关节点和边的高亮样式（如果打开了间接血缘按钮，那这些间接血缘也需要高亮）
-        (_a = this.dataProcessor) === null || _a === void 0 ? void 0 : _a.refreshRelatedNodesAndEdges(this.relatedNodes, this.relatedEdges);
-        (_b = this.dataProcessor) === null || _b === void 0 ? void 0 : _b.updateNodesAndEdgesVisible(this.parsedData, (_c = this.rightKeyMenuManager) === null || _c === void 0 ? void 0 : _c.edgeDashVisible, (_d = this.rightKeyMenuManager) === null || _d === void 0 ? void 0 : _d.onlyShowRelated, (_e = this.foldLineageManager) === null || _e === void 0 ? void 0 : _e.isFoldChecked);
-        (_f = this.dataProcessor) === null || _f === void 0 ? void 0 : _f.updateSideIconVisible(this.parsedData);
-        updateNodeHeight(this.parsedData);
-        updateColumnPosition(this.parsedData);
+        var _a, _b, _c, _d, _e;
+        if (this.config.lineageType === ELineageType.TASK) {
+            this.taskRefreshExtraStatus();
+        }
+        else if (this.config.lineageType === ELineageType.SCHEDULE) {
+            this.scheduleRefreshExtraStatus();
+        }
+        else {
+            (_a = this.dataProcessor) === null || _a === void 0 ? void 0 : _a.updateNodesAndEdgesVisible(this.parsedData, (_b = this.rightKeyMenuManager) === null || _b === void 0 ? void 0 : _b.edgeDashVisible, (_c = this.rightKeyMenuManager) === null || _c === void 0 ? void 0 : _c.onlyShowRelated, (_d = this.foldLineageManager) === null || _d === void 0 ? void 0 : _d.isFoldChecked);
+            // 刷新相关节点和边的高亮样式（如果打开了间接血缘按钮，那这些间接血缘也需要高亮）
+            (_e = this.dataProcessor) === null || _e === void 0 ? void 0 : _e.refreshRelatedNodesAndEdges(this.relatedNodes, this.relatedEdges);
+            // (
+            //   this.dataProcessor as TableDataProcessor<TTableData, TColumnData>
+            // )?.updateSideIconVisible(this.parsedData);
+            updateNodeHeight(this.parsedData);
+            updateColumnPosition(this.parsedData);
+        }
     };
     InkLineageManager.prototype.updateActiveNodes = function (nodes) {
         var _a, _b;
@@ -354,7 +444,7 @@ var InkLineageManager = /** @class */ (function () {
         var _a, _b, _c;
         if (needUpdate === void 0) { needUpdate = true; }
         // reset prev related nodes
-        var activeNodeIds = this.activeNodes.map(function (n) { return n.id; });
+        var activeNodeIds = this.activeNodes.map(function (n) { return n === null || n === void 0 ? void 0 : n.id; }) || [];
         (_a = this.relatedNodes) === null || _a === void 0 ? void 0 : _a.forEach(function (n) {
             if (!n || activeNodeIds.includes(n.id))
                 return;
@@ -409,7 +499,6 @@ var InkLineageManager = /** @class */ (function () {
         }
     };
     InkLineageManager.prototype.resetEdgeStyle = function (edge) {
-        edge.type = this.getMode() === 'SIMPLE' ? BASE_EDGE : LINEAGE_EDGE;
         edge.style.stroke = '#B1B1B1';
         edge.style.lineWidth = 1;
         edge.style.zIndex = -1;
@@ -491,9 +580,10 @@ var InkLineageManager = /** @class */ (function () {
         this.cachedRelatedNodeConfig = nodeConfig;
         if (!nodeConfig)
             return;
+        var edgeDashVisible = this.rightKeyMenuManager.edgeDashVisible;
         // update related ui
-        var relatedInputs = getRelatedData(nodeConfig, this.parsedData.nodes, this.parsedData.edges, EDirection.INPUT);
-        var relatedOutputs = getRelatedData(nodeConfig, this.parsedData.nodes, this.parsedData.edges, EDirection.OUTPUT);
+        var relatedInputs = getRelatedData(nodeConfig, this.parsedData.nodes, this.parsedData.edges, EDirection.INPUT, edgeDashVisible);
+        var relatedOutputs = getRelatedData(nodeConfig, this.parsedData.nodes, this.parsedData.edges, EDirection.OUTPUT, edgeDashVisible);
         var relatedNodes = _.uniqBy(__spreadArray(__spreadArray([], __read(relatedInputs.relatedNodes), false), __read(relatedOutputs.relatedNodes), false), 'id');
         var relatedEdges = _.uniqBy(__spreadArray(__spreadArray([], __read(relatedInputs.relatedEdges), false), __read(relatedOutputs.relatedEdges), false), 'id');
         this.updateRelatedNodes(relatedNodes, relatedEdges, needUpdate);
@@ -578,6 +668,19 @@ var InkLineageManager = /** @class */ (function () {
     InkLineageManager.prototype.updateHotspotModalState = function (data) {
         this.rightKeyMenuManager.updateHotspotModalState(data);
     };
+    InkLineageManager.prototype.updateAggregationTableModalState = function (data) {
+        this.rightKeyMenuManager.updateAggregationTableModalState(data);
+    };
+    InkLineageManager.prototype.getAggregationTableModalState = function () {
+        return this.rightKeyMenuManager.aggregationTableModalState;
+    };
+    InkLineageManager.prototype.updateRelationConditionState = function (data) {
+        var _a, _b;
+        (_b = (_a = this.rightKeyMenuManager) === null || _a === void 0 ? void 0 : _a.updateRelationConditionState) === null || _b === void 0 ? void 0 : _b.call(_a, data);
+    };
+    InkLineageManager.prototype.getRelationConditionState = function () {
+        return this.rightKeyMenuManager.relationConditionState;
+    };
     // update direct & indirect table visible
     InkLineageManager.prototype.updateEdgeDashVisible = function (edgeDashVisible) {
         this.rightKeyMenuManager.updateEdgeDashVisible(edgeDashVisible);
@@ -591,6 +694,9 @@ var InkLineageManager = /** @class */ (function () {
     InkLineageManager.prototype.getHotspotTipState = function () {
         return this.rightKeyMenuManager.hotspotTipState;
     };
+    InkLineageManager.prototype.getAggregationTableTipState = function () {
+        return this.rightKeyMenuManager.aggregationTableTipState;
+    };
     InkLineageManager.prototype.getOverviewState = function () {
         return this.rightKeyMenuManager.overviewState;
     };
@@ -604,6 +710,17 @@ var InkLineageManager = /** @class */ (function () {
         var _a;
         return (_a = this === null || this === void 0 ? void 0 : this.toolbarManager) === null || _a === void 0 ? void 0 : _a.state;
     };
+    InkLineageManager.prototype.setOnlyShowRelatedData = function (onlyShowRelated, onlyShowRelatedDisable) {
+        this.rightKeyMenuManager.onlyShowRelatedDisable = onlyShowRelatedDisable;
+        this.rightKeyMenuManager.onlyShowRelated = onlyShowRelated;
+        this.emit(EEventEnum.ONLY_SHOW_RELATED_DATA_CHANGE);
+    };
+    InkLineageManager.prototype.getOnlyShowRelatedData = function () {
+        return {
+            onlyShowRelated: this.rightKeyMenuManager.onlyShowRelated,
+            onlyShowRelatedDisable: this.rightKeyMenuManager.onlyShowRelatedDisable,
+        };
+    };
     // 任务
     InkLineageManager.prototype.clearRelatedColumns = function () {
         this.parsedData.nodes.forEach(function (n) { return (n.relatedColumns = []); });
@@ -687,9 +804,11 @@ var InkLineageManager = /** @class */ (function () {
             yCenter > 0 &&
             yCenter < wrapperHeight;
         if (!isVisible) {
+            // this.searchNodeManager.moveTargetToCenter(target);
             var canvasW = this.graph.getWidth();
             var canvasH = this.graph.getHeight();
             (_a = this.graph) === null || _a === void 0 ? void 0 : _a.resetPosition();
+            // this.graph.canvas.getCamera().resetPosition();
             (_b = this.graph) === null || _b === void 0 ? void 0 : _b.translate(x - canvasW / 2 + TASK_TABLE_WIDTH + width / 2, y - canvasH / 2 + height / 2);
         }
     };
@@ -713,7 +832,46 @@ var InkLineageManager = /** @class */ (function () {
     };
     /**************************************** graph *******************************/
     InkLineageManager.prototype.moveTargetToCenter = function (nodeId) {
-        this.graph.moveTargetToCenter(nodeId);
+        if (!nodeId)
+            return;
+        var node = this.parsedData.nodes.find(function (n) { return n.id === nodeId; });
+        if (!node) {
+            console.error("node ".concat(nodeId, " is not found"));
+            return;
+        }
+        // move to center
+        var _a = node.position, x = _a.x, y = _a.y;
+        var _b = node.style, height = _b.height, width = _b.width;
+        var canvasW = this.getCanvasWidth();
+        var canvasH = this.getCanvasHeight();
+        this.resetPosition();
+        // Ink-new: 相机初始在世界坐标 (0,0)
+        // - 节点在世界坐标 (x,y) 的位置
+        // - 相机移动 (dx,dy) 后，节点视觉位置变成 (x+dx, y+dy)
+        // - 要让节点视觉位置在画布中心，需要: x+dx = canvasW/2, y+dy = canvasH/2
+        // - 所以: dx = canvasW/2 - x, dy = canvasH/2 - y
+        // - 再考虑节点中心偏移: dx = canvasW/2 - x - width/2
+        this.translateCanvas(canvasW / 2 - x - width / 2, canvasH / 2 - y - height / 2);
+        // // Ink: 相机初始在世界坐标 (canvasW/2, canvasH/2)
+        // // - 节点在世界坐标 (x,y) 的位置
+        // // - 相机移动 (dx,dy) 后，相机新位置是 (canvasW/2 + dx, canvasH/2 + dy)
+        // // - 节点相对相机的位置变成 (x - (canvasW/2 + dx), y - (canvasH/2 + dy))
+        // // - 要让节点在视觉中心，需要这个相对位置是 (0,0)
+        // // - 所以: x - canvasW/2 - dx = 0, 即 dx = x - canvasW/2
+        // // - 再考虑节点中心偏移: dx = x - canvasW/2 + width/2
+        // this.translateCanvas(
+        //   x - canvasW / 2 + width / 2,
+        //   y - canvasH / 2 + height / 2,
+        // );
+        var _c = this.parsedData, nodes = _c.nodes, edges = _c.edges;
+        var visibleNodes = nodes.filter(function (node) { return node.visible; });
+        var visibleEdges = edges.filter(function (edge) { return edge.visible; });
+        var data = this.handleCulling({
+            nodes: visibleNodes,
+            edges: visibleEdges,
+        });
+        this.graph.setData(data);
+        this.graph.update();
     };
     InkLineageManager.prototype.appendChild = function (child) {
         this.graph.canvas.add(child);
@@ -728,6 +886,12 @@ var InkLineageManager = /** @class */ (function () {
     InkLineageManager.prototype.getCanvas = function () {
         return this.graph.canvas;
     };
+    InkLineageManager.prototype.getCanvasWidth = function () {
+        return this.graph.getWidth();
+    };
+    InkLineageManager.prototype.getCanvasHeight = function () {
+        return this.graph.getHeight();
+    };
     InkLineageManager.prototype.getNodeInstanceById = function (id) {
         return this.graph.getNodeById(id);
     };
@@ -752,6 +916,9 @@ var InkLineageManager = /** @class */ (function () {
     InkLineageManager.prototype.setGraphData = function (data) {
         this.graph.setData(data);
     };
+    InkLineageManager.prototype.translateCanvas = function (x, y) {
+        this.graph.translate(x, y);
+    };
     return InkLineageManager;
 }());
 export { InkLineageManager };