joshuacoles/revision-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove unnecessary user interaction with donut chart
All checks were successful
Build and Publish Docker Container / build (push) Successful in 4m22s
Details

Browse Source
This commit is contained in:
Joshua Coles 2024-02-28 17:18:56 +00:00
parent d6b319e6a5
commit 89558cdd1a
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Donut.tsx
View File

@ -8,7 +8,12 @@ export type DonutChartData = {
value: number; value: number;
}[]; }[];
export function Donut({data, centerLabel, formatter, hoverSuffix}: { export function Donut({
data,
centerLabel,
formatter,
hoverSuffix
}: {
data: DonutChartData, data: DonutChartData,
formatter: (value: number) => string, formatter: (value: number) => string,
centerLabel: string, centerLabel: string,
@ -71,12 +76,13 @@ export function Donut({data, centerLabel, formatter, hoverSuffix}: {
strokeWidth="3" strokeWidth="3"
strokeDasharray={`${value * normalisingFactor} ${100 - value * normalisingFactor}`} strokeDasharray={`${value * normalisingFactor} ${100 - value * normalisingFactor}`}
strokeDashoffset={100 - (offset * normalisingFactor) + 25} strokeDashoffset={100 - (offset * normalisingFactor) + 25}
style={{outline: 'none'}}
/> />
) )
}) })
} }
<g className="chart-text"> <g className="chart-text" style={{ userSelect: 'none'}}>
<text x="50%" y="50%" className="chart-number"> <text x="50%" y="50%" className="chart-number">
{formatter(total)} {formatter(total)}
</text> </text>