Remove unnecessary chart elements
Removes label lines from pie charts and percentage display from payment method chart.
This commit is contained in:
@@ -26,7 +26,7 @@ const ExpenseChart: React.FC<ExpenseChartProps> = ({ data }) => {
|
||||
outerRadius={60}
|
||||
paddingAngle={5}
|
||||
dataKey="value"
|
||||
labelLine={true}
|
||||
labelLine={false}
|
||||
label={({ name, percent }) => (
|
||||
`${name} ${(percent * 100).toFixed(0)}%`
|
||||
)}
|
||||
|
||||
@@ -41,7 +41,7 @@ const PaymentMethodChart: React.FC<PaymentMethodChartProps> = ({ data, isEmpty }
|
||||
outerRadius={60}
|
||||
paddingAngle={5}
|
||||
dataKey="value"
|
||||
labelLine={true}
|
||||
labelLine={false}
|
||||
label={({ name, percent }) => `${name} ${(percent * 100).toFixed(0)}%`}
|
||||
fontSize={12}
|
||||
>
|
||||
@@ -49,15 +49,7 @@ const PaymentMethodChart: React.FC<PaymentMethodChartProps> = ({ data, isEmpty }
|
||||
<Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
|
||||
))}
|
||||
</Pie>
|
||||
<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;
|
||||
}}
|
||||
/>
|
||||
{/* Legend 제거 */}
|
||||
</PieChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user