Skip to content

Commit fc23938

Browse files
authored
feat(diagnostics): Display category value on hover of stacked graph (#139)
Added a tip to stacked line and bar charts to display values of the category being hovered over. Examples: ![image](https://github.com/user-attachments/assets/354d4073-ad39-46fe-b042-0abc047a36c8) ![image](https://github.com/user-attachments/assets/3fccfed3-2b93-4910-bc26-f302e8538011) ![image](https://github.com/user-attachments/assets/dcf94c42-56f4-4bd3-a598-93054d020826)
1 parent 8d2a3c6 commit fc23938

File tree

3 files changed

+16
-2
lines changed

3 files changed

+16
-2
lines changed

webview-ui/src/diagnostics_panel/App.css

+8
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,10 @@ main {
2727
max-width: initial;
2828
}
2929

30+
.minecraft-statistic-stacked-line-chart-figure tspan {
31+
fill: black;
32+
}
33+
3034
.minecraft-statistic-stacked-line-chart-swatches {
3135
font-family: system-ui, sans-serif;
3236
font-size: 10px;
@@ -91,6 +95,10 @@ main {
9195
margin-right: 1em;
9296
}
9397

98+
.minecraft-statistic-stacked-bar-chart tspan {
99+
fill: black;
100+
}
101+
94102
/* .minecraft-statistic-stacked-bar-chart {
95103
--plot-background: white;
96104
display: block;

webview-ui/src/diagnostics_panel/controls/MinecraftStatisticStackedBarChart.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,10 @@ export default function MinecraftStatisticStackedBarChart({
7878
x: 'time',
7979
y: 'value',
8080
fill: 'category',
81-
title: 'category',
81+
title: d => `category: ${d.category}\nvalue: ${d.value}`,
82+
tip: {
83+
fontSize: 12,
84+
},
8285
}),
8386
Plot.ruleY([0]),
8487
],

webview-ui/src/diagnostics_panel/controls/MinecraftStatisticStackedLineChart.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,10 @@ export default function MinecraftStatisticStackedLineChart({
102102
x: 'time',
103103
y: 'value',
104104
fill: 'category',
105-
title: 'category',
105+
title: d => `category: ${d.category}\nvalue: ${parseFloat(d.value.toFixed(3))}`,
106+
tip: {
107+
fontSize: 12,
108+
},
106109
}),
107110
Plot.ruleY([0]),
108111
targetValue ? Plot.ruleY([targetValue]) : undefined,

0 commit comments

Comments
 (0)