From 6e541975129ff561a49bcfd28a40173207930740 Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Thu, 17 Jul 2025 17:31:41 +0800 Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=90=9E=20fix:=20=E5=9B=BE=E6=A0=87?= =?UTF-8?q?=E6=9B=B4=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../tb_graph_ascend/fe/src/graph_controls_board/index.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/index.ts index 59ec172fe3..259cbd55ac 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/index.ts @@ -94,6 +94,7 @@ class TfGraphControls extends LegacyElementMixin(DarkModeMixin(PolymerElement)) height: 26px; margin-right: 5px; color: var(--paper-orange-500); + font-weight: 500; } .allcontrols .control-holder { @@ -135,6 +136,11 @@ class TfGraphControls extends LegacyElementMixin(DarkModeMixin(PolymerElement)) display: flex; align-items: center; } + .fit-screen vaadin-icon { + margin-right: 10px; + cursor: pointer; + color: var(--paper-orange-500); + } .fit-screen vaadin-button { margin-top: 6px; font-size: var(--tb-graph-controls-title-font-size); @@ -157,7 +163,7 @@ class TfGraphControls extends LegacyElementMixin(DarkModeMixin(PolymerElement))
- + 自适应屏幕
-- Gitee From 9d928055bc75e57386c42288cdf120dbfc3ff933 Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Thu, 17 Jul 2025 20:36:42 +0800 Subject: [PATCH 2/8] =?UTF-8?q?=E2=9C=A8=20feat:=20=E5=90=8C=E6=AD=A5?= =?UTF-8?q?=E5=B1=95=E5=BC=80=E8=8A=82=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../graph_board/components/hierarchy/index.ts | 92 ++++++++++++++----- 1 file changed, 67 insertions(+), 25 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts index 0a31f9ccf1..546503920e 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts @@ -405,29 +405,12 @@ class Hierarchy extends PolymerElement { if (item.type === EXPAND_MATCHED_NODE) { // 如果当前节点未匹配,则找到其相邻的匹配父节点 const tempSelectedNode = this.selectedNode; - let nodeName = tempSelectedNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''); - let selectedNode = this.hierarchyObject[nodeName]; - while (isEmpty(selectedNode?.matchedNodeLink) && selectedNode?.parentNode) { - nodeName = selectedNode.parentNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''); - selectedNode = this.hierarchyObject[nodeName]; - } - if (!isEmpty(selectedNode?.matchedNodeLink)) { - let matchedNodeName = selectedNode.matchedNodeLink[selectedNode.matchedNodeLink.length - 1]; - const matchedPrefix = this.graphType === 'NPU' ? BENCH_PREFIX : NPU_PREFIX; - matchedNodeName = matchedNodeName.startsWith(matchedPrefix) - ? matchedNodeName - : matchedPrefix + matchedNodeName; // 加上前缀 - this.set('selectedNode', matchedNodeName); // 选中对应测节点就能触发展开和选中 - this.set('hightLightNodeName', selectedNode.name) - const transform = this.changeNodeCenter(selectedNode.name); - this.renderGraph(this.hierarchyData, selectedNode.name, transform); // 更新selectedNode 会导致当前节点失去高亮显示 - } else { - Notification.show(`展开失败:当前节点及其父节点无匹配节点`, { - position: 'middle', - duration: 3000, - theme: 'error', - }); - } + this.findMatchedNodeName(tempSelectedNode); + const { matchedNodeName, selectedNode } = this.findMatchedNodeName(tempSelectedNode); + this.set('selectedNode', matchedNodeName); // 选中对应测节点就能触发展开和选中 + this.set('hightLightNodeName', selectedNode?.name) + const transform = this.changeNodeCenter(selectedNode.name); + this.renderGraph(this.hierarchyData, selectedNode.name, transform); // 更新selectedNode 会导致当前节点失去高亮显示 } // 数据通信节点右键菜单 if (item.type === DATA_COMMUNICATION) { @@ -499,8 +482,22 @@ class Hierarchy extends PolymerElement { bindChangeNodeExpandStateEvent(container) { const onDoubleClickNodeEvent = async (event) => { event.preventDefault(); - const target: HTMLElement = event.target as HTMLElement; - const selectedNode = target.getAttribute('name'); + let target; + let selectedNode; + //判断是点击展开,还是同步展开 + const isClickGraph = isEmpty(event.detail); + if (isClickGraph) { + target = event.target as HTMLElement; + selectedNode = target.getAttribute('name'); + } + else { + selectedNode = event.detail.nodeName; + const graphType = event.detail.graphType; + //也会触发当前侧图展开才操作,所以需要判断一下 + if (graphType === this.graphType) { + return; + } + } const nodeName = selectedNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''); // 去掉前缀 if (nodeName === this.rootName) { return; @@ -513,6 +510,19 @@ class Hierarchy extends PolymerElement { return; } await this.changeNodeExpandState(nodeInfo); + const { matchedNodeName } = this.findMatchedNodeName(nodeName); + // 如果是点击展开,触发同步展开事件,通知展开对应节点 + if (isClickGraph) { + const changeMatchNodeExpandState = new CustomEvent('changeMatchNodeExpandState', { + detail: { + nodeName: matchedNodeName, // 通知通信图展开对应节点 + graphType: this.graphType, + }, + bubbles: true, // 允许事件冒泡 + composed: true, // 允许跨 Shadow DOM 边界 + }); + this.dispatchEvent(changeMatchNodeExpandState); + } const transform = this.changeNodeCenter(nodeName); this.renderGraph(this.hierarchyData, this.hightLightNodeName, transform); }; @@ -520,6 +530,7 @@ class Hierarchy extends PolymerElement { event.preventDefault(); }; const throttleDoubleClickNodeEvent = throttle(onDoubleClickNodeEvent, 16); + document.addEventListener('changeMatchNodeExpandState', throttleDoubleClickNodeEvent); container.addEventListener('dblclick', throttleDoubleClickNodeEvent); this.graph?.addEventListener('dblclick', onDoubleClickGraphEvent); // 防止双击选中文本 return () => { @@ -715,4 +726,35 @@ class Hierarchy extends PolymerElement { } return { success, data, error }; } + /** + * 寻找目标节点的匹配节点 + * @param tempSelectedNode 目标节点 + * @returns + * matchedNodeName: 匹配节点名称 + * selectedNode: 目标节点信息 + */ + + findMatchedNodeName(tempSelectedNode) { + let nodeName = tempSelectedNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''); + let selectedNode = this.hierarchyObject[nodeName]; + while (isEmpty(selectedNode?.matchedNodeLink) && selectedNode?.parentNode) { + nodeName = selectedNode.parentNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''); + selectedNode = this.hierarchyObject[nodeName]; + } + if (!isEmpty(selectedNode?.matchedNodeLink)) { + let matchedNodeName = selectedNode.matchedNodeLink[selectedNode.matchedNodeLink.length - 1]; + const matchedPrefix = this.graphType === 'NPU' ? BENCH_PREFIX : NPU_PREFIX; + matchedNodeName = matchedNodeName.startsWith(matchedPrefix) + ? matchedNodeName + : matchedPrefix + matchedNodeName; // 加上前缀 + return { matchedNodeName, selectedNode }; + } else { + Notification.show(`展开失败:当前节点及其父节点无匹配节点`, { + position: 'middle', + duration: 3000, + theme: 'error', + }); + return { matchedNodeName: '', selectedNode: {} as HierarchyNodeType }; + } + } } -- Gitee From daab3801c942369a0cdbc873b1f49b7472306f58 Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Fri, 18 Jul 2025 14:59:33 +0800 Subject: [PATCH 3/8] =?UTF-8?q?=E2=9C=A8=20feat:=20=E6=95=B0=E5=AD=97?= =?UTF-8?q?=E7=AA=81=E5=87=BA=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/tf_color_select/index.ts | 33 ++++++++++++++++--- 1 file changed, 28 insertions(+), 5 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts index a8efe1615b..b9c9c01d47 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts @@ -150,6 +150,20 @@ class Legend extends LegacyElementMixin(DarkModeMixin(PolymerElement)) { left: 2px; } + .search-number{ + display:inline-block; + width:80px; + height:14px; + background-color: #fff; + font-size: 14px; + color: red; + font-weight: bold; + position: relative; + top: 30px; + left: 114px; + z-index: 10; + } + /* Vaadin 组合框样式 */ vaadin-combo-box { flex: 1; @@ -206,6 +220,7 @@ class Legend extends LegacyElementMixin(DarkModeMixin(PolymerElement)) {
+ ([[precisionmenu.length]]) + ([[precisionmenu.length]]) +
Date: Fri, 18 Jul 2025 15:54:04 +0800 Subject: [PATCH 5/8] =?UTF-8?q?=E2=9C=A8=20feat:=20=E4=BF=9D=E6=8C=81?= =?UTF-8?q?=E5=B1=95=E5=BC=80=E7=8A=B6=E6=80=81=E5=90=8C=E6=AD=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../fe/src/graph_board/components/hierarchy/index.ts | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts index 67b937acb3..8308b9fcd5 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts @@ -495,9 +495,14 @@ class Hierarchy extends PolymerElement { } else { selectedNode = event.detail.nodeName; + selectedNode = selectedNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), '') const graphType = event.detail.graphType; + + const orginNodeExpandState = event.detail.npdeExpandState; + const targetNodeExpandState = this.hierarchyObject[selectedNode]?.expand; //也会触发当前侧图展开才操作,所以需要判断一下 - if (graphType === this.graphType) { + //保持展开状态同步,如果一侧展开,一侧为展开,则不触发对应测的展开或者收起的操作 + if (graphType === this.graphType || (orginNodeExpandState === targetNodeExpandState)) { return; } } @@ -513,12 +518,13 @@ class Hierarchy extends PolymerElement { return; } await this.changeNodeExpandState(nodeInfo); - const { matchedNodeName } = this.findMatchedNodeName(nodeName); + const findRes = this.findMatchedNodeName(nodeName); // 如果是点击展开,触发同步展开事件,通知展开对应节点 if (isClickGraph && this.isSyncExpand) { const changeMatchNodeExpandState = new CustomEvent('changeMatchNodeExpandState', { detail: { - nodeName: matchedNodeName, // 通知通信图展开对应节点 + nodeName: findRes.matchedNodeName, // 通知通信图展开对应节点 + npdeExpandState: findRes?.selectedNode?.expand, graphType: this.graphType, }, bubbles: true, // 允许事件冒泡 -- Gitee From 1ec18ed7311c154341ebb8de4190348303be5cc8 Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Mon, 21 Jul 2025 15:21:41 +0800 Subject: [PATCH 6/8] =?UTF-8?q?=F0=9F=90=9E=20fix:=20bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../fe/src/graph_board/components/hierarchy/index.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts index 8308b9fcd5..209cdc6002 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts @@ -488,7 +488,7 @@ class Hierarchy extends PolymerElement { let target; let selectedNode; //判断是点击展开,还是同步展开 - const isClickGraph = isEmpty(event.detail); + const isClickGraph = isEmpty(event.detail?.nodeName); if (isClickGraph) { target = event.target as HTMLElement; selectedNode = target.getAttribute('name'); @@ -518,9 +518,10 @@ class Hierarchy extends PolymerElement { return; } await this.changeNodeExpandState(nodeInfo); - const findRes = this.findMatchedNodeName(nodeName); // 如果是点击展开,触发同步展开事件,通知展开对应节点 - if (isClickGraph && this.isSyncExpand) { + if (isClickGraph && this.isSyncExpand && this.graphType !== "Single") { + + const findRes = this.findMatchedNodeName(nodeName); const changeMatchNodeExpandState = new CustomEvent('changeMatchNodeExpandState', { detail: { nodeName: findRes.matchedNodeName, // 通知通信图展开对应节点 @@ -545,6 +546,7 @@ class Hierarchy extends PolymerElement { return () => { container.removeEventListener('dblclick', throttleDoubleClickNodeEvent); this.graph?.removeEventListener('dblclick', onDoubleClickGraphEvent); + document.removeEventListener('changeMatchNodeExpandState', throttleDoubleClickNodeEvent); }; } -- Gitee From 046cfcb5b5a6a28aabaae6c5c293c132046defce Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Mon, 21 Jul 2025 16:35:21 +0800 Subject: [PATCH 7/8] =?UTF-8?q?=F0=9F=90=9E=20fix:=20clean=20code?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../fe/src/graph_board/components/hierarchy/index.ts | 4 ++-- .../tb_graph_ascend/server/app/service/graph_service.py | 4 ++-- .../test/unit/controllers/test_match_nodes_controller.py | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts index 209cdc6002..692c4d0893 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/index.ts @@ -498,7 +498,7 @@ class Hierarchy extends PolymerElement { selectedNode = selectedNode?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), '') const graphType = event.detail.graphType; - const orginNodeExpandState = event.detail.npdeExpandState; + const orginNodeExpandState = event.detail.nodeExpandState; const targetNodeExpandState = this.hierarchyObject[selectedNode]?.expand; //也会触发当前侧图展开才操作,所以需要判断一下 //保持展开状态同步,如果一侧展开,一侧为展开,则不触发对应测的展开或者收起的操作 @@ -525,7 +525,7 @@ class Hierarchy extends PolymerElement { const changeMatchNodeExpandState = new CustomEvent('changeMatchNodeExpandState', { detail: { nodeName: findRes.matchedNodeName, // 通知通信图展开对应节点 - npdeExpandState: findRes?.selectedNode?.expand, + nodeExpandState: findRes?.selectedNode?.expand, graphType: this.graphType, }, bubbles: true, // 允许事件冒泡 diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/server/app/service/graph_service.py b/plugins/tensorboard-plugins/tb_graph_ascend/server/app/service/graph_service.py index 43c05357fc..04586ffb31 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/server/app/service/graph_service.py +++ b/plugins/tensorboard-plugins/tb_graph_ascend/server/app/service/graph_service.py @@ -277,7 +277,7 @@ class GraphService: try: # 根据任务类型计算误差 if task == 'md5' or task == 'summary': - if(is_match_children): + if is_match_children: result = MatchNodesController.process_task_add_child_layer(graph_data, npu_node_name, bench_node_name, task) return result @@ -326,7 +326,7 @@ class GraphService: try: # 根据任务类型计算误差 if task == 'md5' or task == 'summary': - if(is_unmatch_children): + if is_unmatch_children: result = MatchNodesController.process_task_delete_child_layer(graph_data, npu_node_name, bench_node_name, task) else: diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/test/unit/controllers/test_match_nodes_controller.py b/plugins/tensorboard-plugins/tb_graph_ascend/test/unit/controllers/test_match_nodes_controller.py index a677b968b2..8498b67d1d 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/test/unit/controllers/test_match_nodes_controller.py +++ b/plugins/tensorboard-plugins/tb_graph_ascend/test/unit/controllers/test_match_nodes_controller.py @@ -38,7 +38,7 @@ class TestMatchNodesController: ids=lambda c: f"{c['case_id']}:{c['description']}") def test_process_task_delete(self, test_case): """测试删除节点功能""" - if(test_case.get('config', None)): + if test_case.get('config', None): GraphState.set_global_value("config_data", test_case['config']) graph_data, npu_node_name, bench_node_name, task = test_case['input'].values() expected = test_case['expected'] @@ -58,7 +58,7 @@ class TestMatchNodesController: ids=lambda c: f"{c['case_id']}:{c['description']}") def test_process_task_delete_child_layer(self, test_case): """测试删除子节点层功能""" - if(test_case.get('config', None)): + if test_case.get('config', None): GraphState.set_global_value("config_data", test_case['config']) graph_data, npu_node_name, bench_node_name, task = test_case['input'].values() excepted = test_case['expected'] -- Gitee From 01bbf030fdc3c605efed0f1ed8b6b96eeaad6024 Mon Sep 17 00:00:00 2001 From: sunchao <1299792067@qq.com> Date: Mon, 21 Jul 2025 16:40:45 +0800 Subject: [PATCH 8/8] =?UTF-8?q?=E2=9C=A8=20feat:=20clean=20code?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/tf_color_select/index.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts index 68bbc6cb21..44c9f5a786 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_controls_board/components/tf_color_select/index.ts @@ -151,9 +151,9 @@ class Legend extends LegacyElementMixin(DarkModeMixin(PolymerElement)) { } .search-number{ - display:inline-block; - width:80px; - height:14px; + display: inline-block; + width: 80px; + height: 14px; background-color: #fff; font-size: 14px; color: red; @@ -806,7 +806,7 @@ class Legend extends LegacyElementMixin(DarkModeMixin(PolymerElement)) { this.set('precisionmenu', precisionmenu); // 更新数据绑定 this.notifyPath(`menu.${event.model.index}.checked`, checkbox.checked); - // 清除精度筛选输入框W + // 清除精度筛选输入框 this.set('selectedPrecisionNode', precisionmenu?.[0] || ''); setTimeout(() => { this._observePrecsionNode(); -- Gitee