From 54faaf91329789245d85154996b7a3fa09e7efb5 Mon Sep 17 00:00:00 2001 From: wuyulong17 <2284273586@qq.com> Date: Mon, 14 Jul 2025 16:12:22 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BC=80=E6=BA=90=E4=BE=9D=E8=B5=96=E7=89=88?= =?UTF-8?q?=E6=9C=AC=E5=8D=87=E7=BA=A7=E9=80=82=E9=85=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../tb_graph_ascend/fe/package.json | 23 ++++--------------- .../fe/src/graph_ascend/index.ts | 1 - .../graph_board/components/hierarchy/index.ts | 10 ++++---- .../components/hierarchy/useGraph.ts | 5 ++-- .../graph_board/components/minimap/minimap.ts | 14 ++++++----- .../fe/src/graph_board/type/index.d.ts | 1 + .../tb_graph_ascend/fe/src/index.css | 5 +++- .../fe/src/polymer/irons_and_papers.ts | 9 -------- .../tb_graph_ascend/setup.py | 2 +- 9 files changed, 26 insertions(+), 44 deletions(-) diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/package.json b/plugins/tensorboard-plugins/tb_graph_ascend/fe/package.json index fb9c1d48f4..7cb7285a5f 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/package.json +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/package.json @@ -10,8 +10,8 @@ "prettier": "prettier --config ./.prettierrc --write ./src/**/*.ts" }, "devDependencies": { - "@types/d3": "5.7.2", - "@types/lodash": "^4.14.172", + "@types/d3": "^7.4.3", + "@types/lodash": "^4.17.20", "@types/node": "^16.4.13", "@types/offscreencanvas": "^2019.6.3", "@types/requirejs": "^2.1.33", @@ -25,30 +25,17 @@ "typescript": "^5.4.5", "webpack": "^5.96.1", "webpack-cli": "^5.1.4", - "webpack-dev-server": "4.15.1", - "ws": "8.13.0" + "webpack-dev-server": "^4.15.1" }, "dependencies": { "@polymer/decorators": "^3.0.0", - "@polymer/iron-behaviors": "^3.0.1", "@polymer/iron-collapse": "^3.0.1", "@polymer/iron-icon": "^3.0.1", - "@polymer/iron-icons": "^3.0.1", - "@polymer/iron-iconset-svg": "^3.0.1", - "@polymer/iron-list": "^3.1.0", - "@polymer/iron-resizable-behavior": "^3.0.1", - "@polymer/paper-behaviors": "^3.0.1", "@polymer/paper-button": "^3.0.1", "@polymer/paper-checkbox": "^3.1.0", "@polymer/paper-dialog": "^3.0.1", - "@polymer/paper-dropdown-menu": "^3.1.0", - "@polymer/paper-icon-button": "^3.0.2", - "@polymer/paper-item": "^3.0.1", - "@polymer/paper-listbox": "^3.0.1", - "@polymer/paper-progress": "^3.0.1", "@polymer/paper-tooltip": "^3.0.1", "@polymer/polymer": "^3.5.1", - "@types/lodash": "^4.17.1", "@vaadin/button": "24.6.5", "@vaadin/checkbox": "24.6.5", "@vaadin/combo-box": "24.6.5", @@ -69,10 +56,10 @@ "clean-webpack-plugin": "^4.0.0", "cross-env": "^7.0.3", "css-loader": "^7.1.2", - "d3": "5.7.0", + "d3": "^7.9.0", "dagre": "^0.8.5", "lodash": "^4.17.21", "prettier": "^3.4.2", "style-loader": "^4.0.0" } -} \ No newline at end of file +} diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_ascend/index.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_ascend/index.ts index a0f6a86537..1913ce9297 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_ascend/index.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_ascend/index.ts @@ -117,7 +117,6 @@ class TfGraphDashboard extends LegacyElementMixin(PolymerElement) { display: flex; height: 100%; } - .center { height: 100%; 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 f3a4f8a6fe..0a31f9ccf1 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 @@ -228,16 +228,16 @@ class Hierarchy extends PolymerElement { const newTransform = d3.zoomIdentity .translate(initialTransform.x, initialTransform.y) .scale(initialTransform.scale); - const mainZoom = d3.zoom().on('zoom', () => { - this._zoomTransform = (d3 as any).event.transform; + const mainZoom = d3.zoom().on('zoom', (event: d3.D3ZoomEvent) => { + this._zoomTransform = event.transform; if (!this._zoomStartCoords) { this._zoomStartCoords = this._zoomTransform; } if (this.container) { - d3.select(this.container as HTMLElement).attr('transform', (d3 as any).event.transform.toString()); + d3.select(this.container as HTMLElement).attr('transform', event.transform.toString()); } this.renderGraph(this.hierarchyData, this.hightLightNodeName); - this.minimap?.zoom((d3 as any).event.transform); // Notify the minimap. + this.minimap?.zoom(event.transform); // Notify the minimap. }); this.minimap = (minimapEle as any)?.init(this.graph, this.container, mainZoom, 160, 10); @@ -253,7 +253,7 @@ class Hierarchy extends PolymerElement { const prefix = PREFIX_MAP[this.graphType]; const selectedNodeName = selectedNode.startsWith(prefix) ? selectedNode : `${prefix}${selectedNode}`; // 加上前缀 const config = { colors: this.colors, isOverflowFilter: this.isOverflowFilter, graphType: this.graphType }; - const renderData = this.useGraph.preProcessData(data, selectedNodeName, config, transform); + const renderData = this.useGraph.preProcessData(this.hierarchyObject, data, selectedNodeName, config, transform); this.useGraph.bindInnerRect(container, renderData); this.useGraph.bindOuterRect(container, renderData); this.useGraph.bindText(container, renderData); diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/useGraph.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/useGraph.ts index c386bb6431..481c804afa 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/useGraph.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/hierarchy/useGraph.ts @@ -37,6 +37,7 @@ import { } from '../../../common/constant'; const useGraph = (): UseGraphType => { const preProcessData: UseGraphType['preProcessData'] = ( + hierarchyObject: { [key: string]: HierarchyNodeType }, data: Array, selectedNode, config: PreProcessDataConfigType, @@ -55,9 +56,7 @@ const useGraph = (): UseGraphType => { virtualNodes.forEach((d) => { let node: HierarchyNodeType | undefined = d; while (node?.parentNode) { - const parent = data.find( - (dInner) => node?.parentNode === dInner.name?.replace(new RegExp(`^(${NPU_PREFIX}|${BENCH_PREFIX})`), ''), - ); + const parent = hierarchyObject[node.parentNode]; if (parent && virtualNodes.indexOf(parent) === -1 && parentsVirtualNodes.indexOf(parent) === -1) { parentsVirtualNodes.push(parent); } diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/minimap/minimap.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/minimap/minimap.ts index de6fea12d5..256ce67c3a 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/minimap/minimap.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/components/minimap/minimap.ts @@ -88,24 +88,26 @@ export class Minimap { let $minimapSvg = $shadowRoot.select('svg'); // Make the viewpoint rectangle draggable. let $viewpoint = $minimapSvg.select('rect'); - let dragmove = (d): void => { - this.viewpointCoord.x = ((d3 as any).event).x; - this.viewpointCoord.y = ((d3 as any).event).y; + let dragmove = (event: d3.D3DragEvent): void => { + let width = Number($viewpoint.attr('width')); + let height = Number($viewpoint.attr('height')); + this.viewpointCoord.x = event.x- (width / 2);; + this.viewpointCoord.y = event.y- (height / 2);; this.updateViewpoint(); }; this.viewpointCoord = { x: 0, y: 0 }; let drag = d3.drag().subject(Object).on('drag', dragmove); $viewpoint.datum(this.viewpointCoord as any).call(drag as any); // Make the minimap clickable. - $minimapSvg.on('click', (): void => { - if (((d3 as any).event).defaultPrevented) { + $minimapSvg.on('click', (event: Event): void => { + if (event.defaultPrevented) { // This click was part of a drag event, so suppress it. return; } // Update the coordinates of the viewpoint. let width = Number($viewpoint.attr('width')); let height = Number($viewpoint.attr('height')); - let clickCoords = (d3 as any).mouse($minimapSvg.node() as any); + let clickCoords = d3.pointer(event, $minimapSvg.node() as any); this.viewpointCoord.x = clickCoords[0] - (width / 2); this.viewpointCoord.y = clickCoords[1] - (height / 2); this.updateViewpoint(); diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/type/index.d.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/type/index.d.ts index a0ec441868..47db174ac2 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/type/index.d.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/graph_board/type/index.d.ts @@ -53,6 +53,7 @@ export interface UseGraphType { bindOuterRect: (container: any, data: any) => void; bindText: (container: any, data: any) => void; preProcessData: ( + hierarchyObject: { [key: string]: HierarchyNodeType }, data: any[], selectedNode: string, config: PreProcessDataConfigType, diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/index.css b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/index.css index 9e577e1896..e4a6c11e36 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/index.css +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/index.css @@ -40,4 +40,7 @@ vaadin-select-item { .file-path { color: red; font-weight: 400; -} \ No newline at end of file +} +vaadin-confirm-dialog-overlay { + z-index: 1000; +} diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/polymer/irons_and_papers.ts b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/polymer/irons_and_papers.ts index a0d4c3a177..959f02c7fa 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/polymer/irons_and_papers.ts +++ b/plugins/tensorboard-plugins/tb_graph_ascend/fe/src/polymer/irons_and_papers.ts @@ -19,17 +19,8 @@ limitations under the License. import '@polymer/iron-collapse/iron-collapse'; import '@polymer/iron-icon'; -import '@polymer/iron-icons/image-icons'; -import '@polymer/iron-icons/iron-icons'; -import '@polymer/iron-iconset-svg'; -import '@polymer/iron-list/iron-list'; import '@polymer/paper-button'; import '@polymer/paper-checkbox'; import '@polymer/paper-dialog'; -import '@polymer/paper-dropdown-menu/paper-dropdown-menu'; -import '@polymer/paper-icon-button/paper-icon-button'; -import '@polymer/paper-item'; -import '@polymer/paper-listbox'; -import '@polymer/paper-progress'; import '@polymer/paper-tooltip/paper-tooltip'; export { PaperCheckboxElement } from '@polymer/paper-checkbox'; diff --git a/plugins/tensorboard-plugins/tb_graph_ascend/setup.py b/plugins/tensorboard-plugins/tb_graph_ascend/setup.py index 89663352d2..101b8900e4 100644 --- a/plugins/tensorboard-plugins/tb_graph_ascend/setup.py +++ b/plugins/tensorboard-plugins/tb_graph_ascend/setup.py @@ -16,7 +16,7 @@ # --------------------------------------------------------------------------------------------# import setuptools -VERSION = '8.1.1' +VERSION = '8.1.2' INSTALL_REQUIRED = ["tensorboard >= 2.11.2"] setuptools.setup( -- Gitee