github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-14 09:00:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

update percentage

Browse Source
This commit is contained in:
Qiuxia Fan 2022-05-30 17:17:37 +08:00
parent 4f05b20f74
commit 071f5df4f1
1 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/views/dashboard/related/ebpf/components/EBPFStack.vue
View File

@ -30,6 +30,7 @@ import "d3-flame-graph/dist/d3-flamegraph.css";
/*global Nullable*/
const ebpfStore = useEbpfStore();
const stackTree = ref<Nullable<StackElement>>(null);
const selectStack = ref<Nullable<StackElement>>(null);
const graph = ref<Nullable<HTMLDivElement>>(null);
const flameChart = ref<any>(null);
const min = ref<number>(1);
@ -83,6 +84,9 @@ function drawGraph() {
.title("")
.selfValue(false)
.inverted(true)
.onClick((d: { data: StackElement }) => {
selectStack.value = d.data;
})
.setColorMapper((d, originalColor) =>
d.highlight ? "#6aff8f" : originalColor
);
@ -97,18 +101,18 @@ function drawGraph() {
: `<div class="mb-5">Duration: ${d.data.dumpCount} ns</div>`;
const rateOfParent =
(d.parent &&
`<div class="mb-5">Rate Of Parent: ${
((d.data.dumpCount / d.parent.data.dumpCount) * 100).toFixed(3) +
"%"
`<div class="mb-5">Percentage Of Selected: ${
(
(d.data.dumpCount /
((selectStack.value && selectStack.value.dumpCount) ||
root.dumpCount)) *
100
).toFixed(3) + "%"
}</div>`) ||
"";
const rateOfRoot =
(d.parent &&
`<div class="mb-5">Rate Of Root: ${
const rateOfRoot = `<div class="mb-5">Percentage Of Root: ${
((d.data.dumpCount / root.dumpCount) * 100).toFixed(3) + "%"
}</div>`) ||
"";
}</div>`;
return `<div class="mb-5 name">Symbol: ${name}</div>${valStr}${rateOfParent}${rateOfRoot}`;
})
.style("max-width", "500px");