ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove unnecessary chart elements

Browse Source 
Removes label lines from pie charts and percentage display from payment method chart.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-22 12:49:50 +00:00
parent b67ebf4631
commit 2a1fc6aa7a
2 changed files with 3 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ExpenseChart.tsx
View File

@@ -26,7 +26,7 @@ const ExpenseChart: React.FC<ExpenseChartProps> = ({ data }) => {
outerRadius={60} outerRadius={60}
paddingAngle={5} paddingAngle={5}
dataKey="value" dataKey="value"
labelLine={true} labelLine={false}
label={({ name, percent }) => ( label={({ name, percent }) => (
`${name} ${(percent * 100).toFixed(0)}%` `${name} ${(percent * 100).toFixed(0)}%`
)} )}

12
src/components/analytics/PaymentMethodChart.tsx
View File

@@ -41,7 +41,7 @@ const PaymentMethodChart: React.FC<PaymentMethodChartProps> = ({ data, isEmpty }
outerRadius={60} outerRadius={60}
paddingAngle={5} paddingAngle={5}
dataKey="value" dataKey="value"
labelLine={true} labelLine={false}
label={({ name, percent }) => `${name} ${(percent * 100).toFixed(0)}%`} label={({ name, percent }) => `${name} ${(percent * 100).toFixed(0)}%`}
fontSize={12} fontSize={12}
> >
@@ -49,15 +49,7 @@ const PaymentMethodChart: React.FC<PaymentMethodChartProps> = ({ data, isEmpty }
<Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} /> <Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
))} ))}
</Pie> </Pie>
<Legend {/* Legend 제거 */}
verticalAlign="bottom"
align="center"
layout="horizontal"
formatter={(value) => {
const item = data.find(d => d.method === value);
return item ? `${value} (${item.percentage.toFixed(0)}%)` : value;
}}
/>
</PieChart> </PieChart>
</ResponsiveContainer> </ResponsiveContainer>
</div> </div>