Fixed #674 - added new chart: Average transaction amount per category

src/main/java/de/deadlocker8/budgetmaster/charts/DefaultCharts.java

@@ -54,6 +54,10 @@ public class DefaultCharts
 			getChartFromFile("charts/IncomesAndExpendituresPerYearByCategories.js"),
 			ChartType.DEFAULT, 2, ChartDisplayType.BAR, ChartGroupType.YEAR, "incomesAndExpendituresPerYearByCategories.png");
 
+	private static final Chart CHART_AVERAGE_TRANSACTION_AMOUNT_PER_CATEGORY = new Chart("charts.default.averageTransactionAmountPerCategory",
+			getChartFromFile("charts/AverageTransactionAmountPerCategoryBar.js"),
+			ChartType.DEFAULT, 2, ChartDisplayType.BAR, ChartGroupType.NONE, "averageTransactionAmountPerCategory.png");
+
 	private DefaultCharts()
 	{
 	}
@@ -70,6 +74,7 @@ public class DefaultCharts
 		charts.add(CHART_REST_PER_MONTH);
 		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);
 		return charts;
 	}
 

src/main/resources/charts/AverageTransactionAmountPerCategoryBar.js

+/* 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.
+
+var categoryNames = [];
+var colors = [];
+var values = [];
+
+for(var i = 0; i < transactionData.length; i++)
+{
+    var transaction = transactionData[i];
+
+    var categoryName = transaction.category.name;
+    // create new category if not already in dict
+    if(!categoryNames.includes(categoryName))
+    {
+        categoryNames.push(categoryName);
+        colors.push(transaction.category.color);
+        values.push([]);
+    }
+
+    // determine index of categoryName in list because the transactions are not ordered by category and some categories
+    // will be missing either for income or expenditures
+    var index = categoryNames.indexOf(categoryName);
+
+    // add to income or expenditure sum
+    var amount = transaction.amount;
+    values[index].push(Math.abs(amount));
+}
+
+
+// Prepare your chart settings here (mandatory)
+var plotlyData = [];
+
+for(var j = 0; j < categoryNames.length; j++)
+{
+    var currentName = categoryNames[j];
+
+    var sumOfValues = 0;
+    values[j].forEach(function(value)
+    {
+        sumOfValues += value;
+    });
+
+    var averageValue = (sumOfValues / values[j].length) / 100;
+
+    var hoverText = prepareHoverText(currentName, averageValue);
+
+    // add border if category color is white
+    var borderWidth = 0;
+    if(colors[j] === '#FFFFFF')
+    {
+        borderWidth = 1;
+    }
+
+    plotlyData.push({
+        y: [averageValue],
+        x: [currentName],
+        orientation: 'v',
+        type: 'bar',
+        hoverinfo: 'text',
+        hovertext: [hoverText],
+        name: currentName,
+        marker: {
+            color: colors[j],  // use the category's color
+            line: {
+                color: '#212121',
+                width: borderWidth
+            }
+        }
+    });
+}
+
+
+// Add your Plotly layout settings here (optional)
+var plotlyLayout = {
+    title: {
+        text: localizedTitle
+    },
+    xaxis: {
+    },
+    yaxis: {
+        title: localizedData['label1'] + ' ' + localizedCurrency,
+        rangemode: 'tozero',
+        tickformat: '.2f',
+        showline: true
+    },
+    barmode: 'stack',
+    hovermode: 'closest' // show hover popup only for hovered item
+};
+
+// 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);
+
+
+function prepareHoverText(categoryName, value)
+{
+    return categoryName + ' ' + value.toFixed(1) + ' ' + localizedCurrency;
+}
\ No newline at end of file

src/main/resources/languages/base_de.properties

@@ -552,6 +552,8 @@ charts.default.incomesAndExpendituresPerYearBar=Eingaben/Ausgaben
 charts.default.incomesAndExpendituresPerYearBar.localization='{"axisY": "Summe in ", "traceName1": "Einnahmen", "traceName2": "Ausgaben"'}
 charts.default.incomesAndExpendituresPerYearByCategories=Eingaben/Ausgaben nach Kategorien
 charts.default.incomesAndExpendituresPerYearByCategories.localization='{"label1": "Ausgaben", "label2": "Einnahmen"'}
+charts.default.averageTransactionAmountPerCategory=Durchschnittlicher Transaktionsbetrag pro Kategorie
+charts.default.averageTransactionAmountPerCategory.localization='{"label1": "Durchschnittlicher Transaktionsbetrag in"'}
 
 chart.new.label.name=Name
 chart.new.label.script=Script

src/main/resources/languages/base_en.properties

@@ -552,6 +552,8 @@ charts.default.incomesAndExpendituresPerYearBar=Incomes/Expenditures
 charts.default.incomesAndExpendituresPerYearBar.localization='{"axisY": "Sum in ", "traceName1": "Incomes", "traceName2": "Expenditures"'}
 charts.default.incomesAndExpendituresPerYearByCategories=Incomes/Expenditures by categories
 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"'}
 
 chart.new.label.name=Name
 chart.new.label.script=Script