mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-07-28 07:52:02 +08:00
fix: decrease the pad angle and remove the empty legend entries (#6507)
* fix: pie chart should not have padding between adjacent items * fix: remove the labels which do not have any data
This commit is contained in:
parent
7fe4f8cc56
commit
96b5e0920f
@ -8,6 +8,7 @@ import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
|
|||||||
import { themeColors } from 'constants/theme';
|
import { themeColors } from 'constants/theme';
|
||||||
import { useIsDarkMode } from 'hooks/useDarkMode';
|
import { useIsDarkMode } from 'hooks/useDarkMode';
|
||||||
import { generateColor } from 'lib/uPlotLib/utils/generateColor';
|
import { generateColor } from 'lib/uPlotLib/utils/generateColor';
|
||||||
|
import { isNaN } from 'lodash-es';
|
||||||
import { useRef, useState } from 'react';
|
import { useRef, useState } from 'react';
|
||||||
import { Query } from 'types/api/queryBuilder/queryBuilderData';
|
import { Query } from 'types/api/queryBuilder/queryBuilderData';
|
||||||
|
|
||||||
@ -44,7 +45,7 @@ function PiePanelWrapper({
|
|||||||
|
|
||||||
const isDarkMode = useIsDarkMode();
|
const isDarkMode = useIsDarkMode();
|
||||||
|
|
||||||
const pieChartData: {
|
let pieChartData: {
|
||||||
label: string;
|
label: string;
|
||||||
value: string;
|
value: string;
|
||||||
color: string;
|
color: string;
|
||||||
@ -67,6 +68,10 @@ function PiePanelWrapper({
|
|||||||
)
|
)
|
||||||
.filter((d) => d !== undefined) as never[]),
|
.filter((d) => d !== undefined) as never[]),
|
||||||
);
|
);
|
||||||
|
pieChartData = pieChartData.filter(
|
||||||
|
(arc) =>
|
||||||
|
arc.value && !isNaN(parseFloat(arc.value)) && parseFloat(arc.value) > 0,
|
||||||
|
);
|
||||||
|
|
||||||
let size = 0;
|
let size = 0;
|
||||||
let width = 0;
|
let width = 0;
|
||||||
@ -108,7 +113,7 @@ function PiePanelWrapper({
|
|||||||
if (!active) return half - 3;
|
if (!active) return half - 3;
|
||||||
return data.label === active.label ? half : half - 3;
|
return data.label === active.label ? half : half - 3;
|
||||||
}}
|
}}
|
||||||
padAngle={0.02}
|
padAngle={0.01}
|
||||||
cornerRadius={3}
|
cornerRadius={3}
|
||||||
width={size}
|
width={size}
|
||||||
height={size}
|
height={size}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user