scottk/wlan-cloud-ui-library
1
0
Fork 0
mirror of https://github.com/Telecominfraproject/wlan-cloud-ui-library.git synced 2025-11-02 19:58:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #342 from Telecominfraproject/bugfix/NOJIRA-label-overlap-fix

Browse Source 
NOJIRA: Pie Chart Overlap Fix
This commit is contained in:
Sean Macfarlane
2022-04-13 17:14:39 -04:00
committed by GitHub
parent 93d21ab90d 1f6b548240
commit 0fda945ce4
1 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/containers/Dashboard/components/PieChart/index.js
View File

@@ -31,18 +31,24 @@ const MyPieChart = ({ chartData, title, loading, chartTextColor }) => {
/> />
); );
const renderLabel = ({ name, x, y, cx }) => ( const renderLabel = ({ name, x, y, cx, index, percent }) => {
<text const label = (
x={x} <text
y={y} x={x}
fill={chartTextColor} y={y}
dominantBaseline="central" fill={chartTextColor}
textAnchor={x > cx ? 'start' : 'end'} dominantBaseline="central"
style={{ fontSize: '12px' }} textAnchor={x > cx ? 'start' : 'end'}
> style={{ fontSize: '14px' }}
{name} >
</text> {name}
); </text>
);
if (activeIndex) {
return activeIndex === index ? label : null;
}
return percent > 0.05 ? label : null;
};
return ( return (
<Card title={title}> <Card title={title}>
@@ -54,6 +60,7 @@ const MyPieChart = ({ chartData, title, loading, chartTextColor }) => {
dataKey="value" dataKey="value"
data={pieData} data={pieData}
label={renderLabel} label={renderLabel}
labelLine={false}
activeIndex={activeIndex} activeIndex={activeIndex}
onMouseOver={onMouseOver} onMouseOver={onMouseOver}
onMouseLeave={onMouseLeave} onMouseLeave={onMouseLeave}