Rename chart labels

Rename income/expense labels to budget/expense in monthly chart.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 02:52:22 +00:00
parent c22dcd52f9
commit feb055d315

View File

@@ -24,37 +24,38 @@ const Analytics = () => {
color: '#81c784'
}];
// Sample data for the monthly comparison
// Sample data for the monthly comparison - renamed income to budget
const monthlyData = [{
name: '3월',
income: 2400000,
budget: 2400000,
expense: 1800000
}, {
name: '4월',
income: 2300000,
budget: 2300000,
expense: 1700000
}, {
name: '5월',
income: 2700000,
budget: 2700000,
expense: 1900000
}, {
name: '6월',
income: 2200000,
budget: 2200000,
expense: 1500000
}, {
name: '7월',
income: 2500000,
budget: 2500000,
expense: 1650000
}, {
name: '8월',
income: 2550000,
budget: 2550000,
expense: 1740000
}];
const totalIncome = 2550000;
// Updated variable names to match new terminology
const totalBudget = 2550000;
const totalExpense = 1740000;
const savings = totalIncome - totalExpense;
const savingsPercentage = Math.round(savings / totalIncome * 100);
const savings = totalBudget - totalExpense;
const savingsPercentage = Math.round(savings / totalBudget * 100);
// Custom formatter for Y-axis that removes currency symbol and uses K format
const formatYAxisTick = (value: number) => {
@@ -104,7 +105,7 @@ const Analytics = () => {
currency: 'KRW',
notation: 'compact',
maximumFractionDigits: 1
}).format(totalIncome)}
}).format(totalBudget)}
</p>
</div>
<div className="neuro-card">
@@ -146,7 +147,7 @@ const Analytics = () => {
<YAxis tickFormatter={formatYAxisTick} />
<Tooltip formatter={formatTooltip} />
<Legend />
<Bar dataKey="income" name="수입" fill="#81c784" radius={[4, 4, 0, 0]} />
<Bar dataKey="budget" name="예산" fill="#81c784" radius={[4, 4, 0, 0]} />
<Bar dataKey="expense" name="지출" fill="#e57373" radius={[4, 4, 0, 0]} />
</BarChart>
</ResponsiveContainer>