Fix expense chart labels
The labels on the expense chart were missing. This commit fixes the issue by ensuring the labels are displayed correctly.
This commit is contained in:
@@ -26,12 +26,8 @@ const ExpenseChart: React.FC<ExpenseChartProps> = ({ data }) => {
|
|||||||
outerRadius={70}
|
outerRadius={70}
|
||||||
paddingAngle={5}
|
paddingAngle={5}
|
||||||
dataKey="value"
|
dataKey="value"
|
||||||
labelLine={false}
|
labelLine={true}
|
||||||
label={({ name, percent }) => (
|
label={({ name, percent }) => `${name} ${(percent * 100).toFixed(0)}%`}
|
||||||
<text className="text-sm" textAnchor="middle" style={{ fontSize: '12px' }}>
|
|
||||||
{`${name} ${(percent * 100).toFixed(0)}%`}
|
|
||||||
</text>
|
|
||||||
)}
|
|
||||||
>
|
>
|
||||||
{data.map((entry, index) => (
|
{data.map((entry, index) => (
|
||||||
<Cell key={`cell-${index}`} fill={entry.color} />
|
<Cell key={`cell-${index}`} fill={entry.color} />
|
||||||
|
|||||||
Reference in New Issue
Block a user