diff --git a/src/main/java/de/deadlocker8/budgetmaster/charts/DefaultCharts.java b/src/main/java/de/deadlocker8/budgetmaster/charts/DefaultCharts.java index 21e44601e5d027830c1eb3377bb3ac7e76df5db4..eb2f9a398a0d492a26ce0301a0e76f252b9f9e2a 100644 --- a/src/main/java/de/deadlocker8/budgetmaster/charts/DefaultCharts.java +++ b/src/main/java/de/deadlocker8/budgetmaster/charts/DefaultCharts.java @@ -58,6 +58,10 @@ public class DefaultCharts getChartFromFile("charts/AverageTransactionAmountPerCategoryBar.js"), ChartType.DEFAULT, 2, ChartDisplayType.BAR, ChartGroupType.NONE, "averageTransactionAmountPerCategory.png"); + private static final Chart CHART_AVERAGE_INCOMES_AND_EXPENDITURES_PER_YEAR_BAR = new Chart("charts.default.averageIncomesAndExpendituresPerYearBar", + getChartFromFile("charts/AverageIncomesAndExpendituresPerYearBar.js"), + ChartType.DEFAULT, 4, ChartDisplayType.BAR, ChartGroupType.YEAR, "averageIncomesAndExpendituresPerYearBar.png"); + private DefaultCharts() { } @@ -75,6 +79,7 @@ public class DefaultCharts charts.add(CHART_INCOMES_AND_EXPENDITURES_PER_YEAR_BAR); charts.add(CHART_INCOMES_AND_EXPENDITURES_PER_YEAR_BY_CATEGORIES); charts.add(CHART_AVERAGE_TRANSACTION_AMOUNT_PER_CATEGORY); + charts.add(CHART_AVERAGE_INCOMES_AND_EXPENDITURES_PER_YEAR_BAR); return charts; } diff --git a/src/main/resources/charts/AverageIncomesAndExpendituresPerYearBar.js b/src/main/resources/charts/AverageIncomesAndExpendituresPerYearBar.js new file mode 100644 index 0000000000000000000000000000000000000000..df534b8ca493001c6ac8c86fcd43546e1a4f9066 --- /dev/null +++ b/src/main/resources/charts/AverageIncomesAndExpendituresPerYearBar.js @@ -0,0 +1,112 @@ +/* This list will be dynamically filled with all the transactions between + * the start and and date you select on the "Show Chart" page + * and filtered according to your specified filter. + * An example entry for this list and tutorial about how to create custom charts ca be found in the BudgetMaster wiki: + * https://github.com/deadlocker8/BudgetMaster/wiki/How-to-create-custom-charts + */ +var transactionData = []; + +// Note: All variables starting with "localized" are only available inside default charts. +moment.locale(localizedLocale); + +var dates = []; +var incomes = []; +var incomeSums = []; +var numberOfIncomes = []; +var numberOfExpenditures = []; +var expenditureSums = []; + +transactionData = transactionData.reverse(); + +for(var i = 0; i < transactionData.length; i++) +{ + var transaction = transactionData[i]; + + // create new sums if year is not already in list + var date = moment(transaction.date).startOf('year').format('YYYY'); + if(!dates.includes(date)) + { + dates.push(date); + incomeSums.push(0); + numberOfIncomes.push(0); + expenditureSums.push(0); + numberOfExpenditures.push(0); + } + + // add to income or expenditure sum + var amount = transaction.amount; + if(amount > 0) + { + var lastIndex = incomeSums.length - 1; + incomeSums[lastIndex] = incomeSums[lastIndex] + amount; + numberOfIncomes[lastIndex] = numberOfIncomes[lastIndex] + 1; + } + else + { + var lastIndex = expenditureSums.length - 1; + expenditureSums[lastIndex] = expenditureSums[lastIndex] + Math.abs(amount); + numberOfExpenditures[lastIndex] = numberOfExpenditures[lastIndex] + 1; + } +} + +var incomeAverages = []; +var expenditureAverages = []; + +for(let i = 0; i < dates.length; i++) +{ + var currentIncomeAverage = (incomeSums[i] / 100) / numberOfIncomes[i]; + incomeAverages.push(currentIncomeAverage); + + var currentExpenditureAverage = (expenditureSums[i] / 100) / numberOfExpenditures[i]; + expenditureAverages.push(currentExpenditureAverage); +} + +// Prepare your chart settings here (mandatory) +var plotlyData = [ + { + x: dates, + y: incomeAverages, + type: 'bar', + name: localizedData['traceName1'] + }, + { + x: dates, + y: expenditureAverages, + type: 'bar', + name: localizedData['traceName2'] + } +]; + +// Add your Plotly layout settings here (optional) +var plotlyLayout = { + title: { + text: localizedTitle + }, + yaxis: { + title: localizedData['axisY'] + localizedCurrency, + rangemode: 'tozero', + tickformat: '.2f', + showline: true + }, + xaxis: { + + } +}; + +// Add your Plotly configuration settings here (optional) +var plotlyConfig = { + showSendToCloud: false, + displaylogo: false, + showLink: false, + responsive: true, + displayModeBar: true, + toImageButtonOptions: { + format: 'png', + filename: 'BudgetMaster_chart_export', + height: 1080, + width: 1920, + } +}; + +// Don't touch this line +Plotly.newPlot("containerID", plotlyData, plotlyLayout, plotlyConfig); \ No newline at end of file diff --git a/src/main/resources/languages/base_de.properties b/src/main/resources/languages/base_de.properties index 759c10e3191f3578d281f316c80a77dcdc713e61..70e0994e2532cac7122d77b85310d5c5dcd65b0f 100644 --- a/src/main/resources/languages/base_de.properties +++ b/src/main/resources/languages/base_de.properties @@ -554,6 +554,8 @@ charts.default.incomesAndExpendituresPerYearByCategories=Eingaben/Ausgaben nach charts.default.incomesAndExpendituresPerYearByCategories.localization='{"label1": "Ausgaben", "label2": "Einnahmen"'} charts.default.averageTransactionAmountPerCategory=Durchschnittlicher Transaktionsbetrag pro Kategorie charts.default.averageTransactionAmountPerCategory.localization='{"label1": "Durchschnittlicher Transaktionsbetrag in"'} +charts.default.averageIncomesAndExpendituresPerYearBar=Durchschnittliche Einnahmen/Ausgaben +charts.default.averageIncomesAndExpendituresPerYearBar.localization='{"traceName1": "Einnahmen", "traceName2": "Ausgaben"', "axisY": "Durchschnittlicher Betrag in"'} chart.new.label.name=Name chart.new.label.script=Script diff --git a/src/main/resources/languages/base_en.properties b/src/main/resources/languages/base_en.properties index 668e2ee21339fbba027e9cc14bd16f46f2cb0c16..058a4d3216d76d86ca0b19f072d9911a81dd728f 100644 --- a/src/main/resources/languages/base_en.properties +++ b/src/main/resources/languages/base_en.properties @@ -554,6 +554,8 @@ charts.default.incomesAndExpendituresPerYearByCategories=Incomes/Expenditures by charts.default.incomesAndExpendituresPerYearByCategories.localization='{"label1": "Expenditures", "label2": "Incomes"'} charts.default.averageTransactionAmountPerCategory=Average transaction amount per category charts.default.averageTransactionAmountPerCategory.localization='{"label1": "Average transaction amount in"'} +charts.default.averageIncomesAndExpendituresPerYearBar=Average incomes/expenditures +charts.default.averageIncomesAndExpendituresPerYearBar.localization='{"traceName1": "Incomes", "traceName2": "Expenditures"', "axisY": "Average amount in"'} chart.new.label.name=Name chart.new.label.script=Script diff --git a/src/main/resources/static/images/charts/averageIncomesAndExpendituresPerYearBar.png b/src/main/resources/static/images/charts/averageIncomesAndExpendituresPerYearBar.png new file mode 100644 index 0000000000000000000000000000000000000000..fa26b0d9e14df12726e3e7dffef3f82be0a1b568 Binary files /dev/null and b/src/main/resources/static/images/charts/averageIncomesAndExpendituresPerYearBar.png differ