Add render for empty donut chart. (#48583)

This commit is contained in:
Justin Kambic 2019-10-25 10:21:56 -04:00 committed by GitHub
parent d1d7d8a86a
commit e16a36df33
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -25,6 +25,10 @@ export const DonutChart = ({ height, down, up, width }: DonutChartProps) => {
colors: { danger, gray },
} = useContext(UptimeSettingsContext);
let upCount = up;
if (up === 0 && down === 0) {
upCount = 1;
}
useEffect(() => {
if (chartElement.current !== null) {
// we must remove any existing paths before painting
@ -50,7 +54,7 @@ export const DonutChart = ({ height, down, up, width }: DonutChartProps) => {
.data(
// @ts-ignore pie generator expects param of type number[], but only works with
// output of d3.entries, which is like Array<{ key: string, value: number }>
pieGenerator(d3.entries({ up, down }))
pieGenerator(d3.entries({ up: upCount, down }))
)
.enter()
.append('path')
@ -64,7 +68,7 @@ export const DonutChart = ({ height, down, up, width }: DonutChartProps) => {
)
.attr('fill', (d: any) => color(d.data.key));
}
}, [chartElement.current, up, down]);
}, [chartElement.current, upCount, down]);
return (
<EuiFlexGroup alignItems="center" responsive={false}>
<EuiFlexItem grow={false}>