diff --git a/src/views/dashboard/related/trace/utils/d3-trace-list.ts b/src/views/dashboard/related/trace/utils/d3-trace-list.ts index 7b1d78a4..1757e729 100644 --- a/src/views/dashboard/related/trace/utils/d3-trace-list.ts +++ b/src/views/dashboard/related/trace/utils/d3-trace-list.ts @@ -120,6 +120,7 @@ export default class ListGraph { if (event.target === this) { d3.select("#trace-action-box").style("display", "none"); t.selectedNode && t.selectedNode.classed("highlighted", false); + t.clearParentHighlight(); } }); } @@ -406,14 +407,17 @@ export default class ListGraph { callback(); } } + clearParentHighlight() { + return this.root.descendants().map((node: { id: number }) => { + d3.select(`#list-node-${node.id}`).classed("highlightedParent", false); + return node; + }); + } highlightParents(span: Recordable) { if (!span) { return; } - const nodes = this.root.descendants().map((node: { id: number }) => { - d3.select(`#list-node-${node.id}`).classed("highlightedParent", false); - return node; - }); + const nodes = this.clearParentHighlight(); const parentSpan = nodes.find( (node: Recordable) => span.spanId === node.data.spanId && diff --git a/src/views/dashboard/related/trace/utils/d3-trace-tree.ts b/src/views/dashboard/related/trace/utils/d3-trace-tree.ts index bf20c847..08f2992c 100644 --- a/src/views/dashboard/related/trace/utils/d3-trace-tree.ts +++ b/src/views/dashboard/related/trace/utils/d3-trace-tree.ts @@ -144,6 +144,7 @@ export default class TraceMap { if (event.target === this) { d3.select("#trace-action-box").style("display", "none"); t.selectedNode && t.selectedNode.classed("highlighted", false); + t.clearParentHighlight(); } }); @@ -404,14 +405,17 @@ export default class TraceMap { that.update(d); } } + clearParentHighlight() { + return this.root.descendants().map((node: { id: number }) => { + d3.select(`#trace-node-${node.id}`).classed("highlightedParent", false); + return node; + }); + } highlightParents(span: Recordable) { if (!span) { return; } - const nodes = this.root.descendants().map((node: { id: number }) => { - d3.select(`#trace-node-${node.id}`).classed("highlightedParent", false); - return node; - }); + const nodes = this.clearParentHighlight(); const parentSpan = nodes.find( (node: Recordable) => span.spanId === node.data.spanId &&