Update app.py

app.py

@@ -70,39 +70,49 @@ 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"))  # This should be the total number of records you want to annotate.
-    annotated_records = len(source_dataset)  # This is the number of records already annotated.
+    total_records = int(os.getenv("TARGET_RECORDS"))  # The total goal of records.
+    annotated_records = len(source_dataset)  # The number of records already annotated.
     pending_records = total_records - annotated_records  # Calculate the pending records.
     percentage_complete = annotated_records / total_records * 100  # The percentage of completion.
 
-    # Create a DataFrame for the progress bar data.
+    # Data for the progress bar chart.
     progress_data = pd.DataFrame({
-        'category': ['Annotated'],
-        'percentage': [percentage_complete]
-    })
-
-    # Create a DataFrame for the annotation label.
-    annotation_label = pd.DataFrame({
-        'category': ['Pending'],
-        'percentage': [percentage_complete],
-        'label': [f'{pending_records} / {annotated_records}']
+        'category': ['Completed', 'Pending'],
+        'percentage': [percentage_complete, 100 - percentage_complete]
     })
 
     # Create the progress bar chart.
-    progress_bar = alt.Chart(progress_data).mark_bar(color='lightgreen', size=50).encode(
-        x=alt.X('percentage:Q', axis=alt.Axis(title='Completion Percentage', format='%'), scale=alt.Scale(domain=(0, 100)))
+    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']))
+    )
+
+    # 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(
+        x='percentage:Q',
+        text='text:N'
     )
 
-    # Add the annotation text to the chart.
-    annotation_text = alt.Chart(annotation_label).mark_text(dx=-15, dy=20, align='right', fontSize=16, fontWeight='bold').encode(
-        x=alt.X('percentage:Q', stack='zero'),
-        text=alt.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 progress bar and the annotation text.
-    chart = (progress_bar + annotation_text).properties(
+    # Combine the bar and the texts.
+    chart = (progress_bar + completed_text + pending_text).properties(
         title='Progress Towards Goal',
         width=700
     )
@@ -110,6 +120,7 @@ def progress_bar_chart() -> alt.Chart:
     return chart
 
 
+
 def donut_chart() -> alt.Chart:
     """
     This function returns a donut chart with the number of annotated and pending records.