From a37277759cd7bd0c5fb02b095162168fa0969e65 Mon Sep 17 00:00:00 2001
From: filippo-ferrari <filippo.ferrari.pr@gmail.com>
Date: Mon, 16 Sep 2024 14:15:24 +0200
Subject: [PATCH] feat: added percentage to pie chart

---
 .../munera/views/dashboard/DashboardView.java         | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/main/java/com/application/munera/views/dashboard/DashboardView.java b/src/main/java/com/application/munera/views/dashboard/DashboardView.java
index dca69ac..9c442a4 100644
--- a/src/main/java/com/application/munera/views/dashboard/DashboardView.java
+++ b/src/main/java/com/application/munera/views/dashboard/DashboardView.java
@@ -242,7 +242,7 @@ public class DashboardView extends Div {
         }
         data.setCharAt(data.length() - 1, ']'); // Replace last comma with closing bracket
 
-        // Generate JavaScript initialization
+        // Generate JavaScript initialization with percentage tooltip
         return "Highcharts.chart('pieChart', {" +
                 "chart: {" +
                 "type: 'pie'" +
@@ -250,9 +250,16 @@ public class DashboardView extends Div {
                 "title: {" +
                 "text: 'Expenses by Category for " + Year.now().getValue() + "'" +
                 "}," +
+                "tooltip: {" +  // Tooltip configuration to show percentage
+                "pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b> ({point.y:.2f})'" +
+                "}," +
                 "plotOptions: {" +
                 "pie: {" +
-                "size: '80%'" + // Adjust size to make the pie chart larger
+                "size: '80%'," +  // Adjust size to make the pie chart larger
+                "dataLabels: {" +  // Enable data labels
+                "enabled: true," +
+                "format: '{point.name}: {point.percentage:.1f}%'" + // Show percentage next to each slice
+                "}" +
                 "}" +
                 "}," +
                 "series: [{" +