Update app.py

app.py

@@ -74,6 +74,10 @@ import altair as alt
 import pandas as pd
 import os
 
+import altair as alt
+import pandas as pd
+import os
+
 def progress_bar_chart() -> alt.Chart:
     source_dataset, _ = obtain_source_target_datasets()
     total_records = int(os.getenv("TARGET_RECORDS"))  # The total goal of records.
@@ -81,46 +85,43 @@ def progress_bar_chart() -> alt.Chart:
     pending_records = total_records - annotated_records  # Calculate the pending records.
     percentage_complete = annotated_records / total_records * 100  # The percentage of completion.
 
-    # Data for the progress bar chart.
+    # Create a DataFrame for the progress bar data.
     progress_data = pd.DataFrame({
-        'category': ['Completed', 'Pending'],
+        'status': ['Completed', 'Pending'],
         'percentage': [percentage_complete, 100 - percentage_complete]
     })
 
+    # Create a DataFrame for the label.
+    label_data = pd.DataFrame({
+        'status': ['Label'],
+        'percentage': [50],  # Centered label
+        'label': [f'{pending_records} Remaining / {total_records} Total']
+    })
+
     # Create the progress bar chart.
     progress_bar = alt.Chart(progress_data).mark_bar(size=40).encode(
         x=alt.X('percentage:Q', axis=alt.Axis(title='Completion Percentage', format='%'), scale=alt.Scale(domain=(0, 100))),
-        color=alt.Color('category:N', scale=alt.Scale(domain=['Completed', 'Pending'], range=['#85C1E9', '#F1948A']))
+        color=alt.Color('status:N', scale=alt.Scale(domain=['Completed', 'Pending'], range=['#28a745', '#dcdcdc']))
     )
 
-    # Create the annotation text for the completed part.
-    completed_text = alt.Chart(pd.DataFrame({
-        'percentage': [percentage_complete / 2],
-        'text': [f'{annotated_records} Completed']
-    })).mark_text(align='left', dx=5, fontSize=12, fontWeight='bold').encode(
+    # Create the annotation text for the label.
+    label_text = alt.Chart(label_data).mark_text(align='center', dx=0, dy=5, fontSize=16, fontWeight='bold').encode(
         x='percentage:Q',
-        text='text:N'
+        text='label:N'
     )
 
-    # Create the annotation text for the pending part.
-    pending_text = alt.Chart(pd.DataFrame({
-        'percentage': [percentage_complete + (100 - percentage_complete) / 2],
-        'text': [f'{pending_records} Pending']
-    })).mark_text(align='left', dx=5, fontSize=12, fontWeight='bold').encode(
-        x='percentage:Q',
-        text='text:N'
-    )
-
-    # Combine the bar and the texts.
-    chart = (progress_bar + completed_text + pending_text).properties(
+    # Combine the bar and the label.
+    chart = (progress_bar + label_text).properties(
         title='Progress Towards Goal',
-        width=700
+        width=800,
+        height=150
     )
 
     return chart
 
 
 
+
 def donut_chart() -> alt.Chart:
     """
     This function returns a donut chart with the number of annotated and pending records.