Update app.py

app.py

@@ -104,41 +104,64 @@ def donut_chart2() -> alt.Chart:
 
     return chart
 
+import altair as alt
+import pandas as pd
+import os
+
 def donut_chart() -> alt.Chart:
-    """
-    This function returns a donut chart with the number of annotated and pending records.
-    Returns:
-        An altair chart with the donut chart.
-    """
+    # Load your data
     source_dataset, results = obtain_source_target_datasets()
     pending_records = len(source_dataset)
     annotated_records = len(results)
 
-    source = pd.DataFrame(
-        {
-            "values": [annotated_records, pending_records],
-            "category": ["Completed", "Remaining"],  # Add a new column for categories
-        }
-    )
+    # Prepare data for the donut chart
+    source = pd.DataFrame({
+        "values": [annotated_records, pending_records],
+        "category": ["Completed", "Remaining"],
+        "colors": ["#4CAF50", "#757575"]  # Green for Completed, Grey for Remaining
+    })
 
+    # Base chart for donut segments
     base = alt.Chart(source).encode(
-        theta=alt.Theta("values:Q", stack=True),
-        radius=alt.Radius(
-            "values", scale=alt.Scale(type="sqrt", zero=True, rangeMin=20)
-        ),
-        color=alt.Color("category:N", legend=alt.Legend(title="Category")),
+        theta=alt.Theta(field="values", type="quantitative", stack=True),  # The angle encoding
+        color=alt.Color(field="colors", type="nominal", legend=None),  # Direct color specification
+        tooltip=['category', 'values']  # Tooltips for interactivity
     )
 
-    c1 = base.mark_arc(innerRadius=20, stroke="#fff")
+    # Arc marks for donut segments
+    arcs = base.mark_arc(innerRadius=100, outerRadius=150, stroke="#fff")  # Increased inner radius for a thicker donut
 
-    c2 = base.mark_text(radiusOffset=10).encode(text="values:Q")
+    # Calculate the midpoints of the arc segments for label placement
+    text_df = pd.DataFrame({
+        'start_angle': [0],
+        'end_angle': [360 * annotated_records / (annotated_records + pending_records)]
+    })
+    text_df = text_df.append({
+        'start_angle': text_df.iloc[0]['end_angle'],
+        'end_angle': 360
+    }, ignore_index=True)
+    text_df['mid_angle'] = (text_df['start_angle'] + text_df['end_angle']) / 2
+
+    # Create labels based on the mid_angle for better placement
+    text = alt.Chart(text_df).mark_text(radius=120, size=20, color='black').encode(
+        text=alt.Text('mid_angle:O', format='.1f'),
+        angle=alt.Angle('mid_angle:Q')
+    )
 
-    chart = c1 + c2
+    # Combine the arcs and text
+    chart = arcs + text
+
+    # Configure the view to have a transparent background
+    chart = chart.configure_view(
+        strokeWidth=0,  # Remove border around chart
+        fill=None  # Ensure background is transparent
+    )
 
     return chart
 
 
 
+
 def kpi_chart() -> alt.Chart:
     """
     This function returns a KPI chart with the total amount of annotators.