Update app.py

app.py

@@ -28,21 +28,6 @@ st.subheader("Select a Country")
 countries = sorted(child_mortality['country'].unique())
 selected_country = st.selectbox("Country", countries, index=0)
 
-st.subheader("About the Visualization")
-st.write("""
-    This visualization explores the trends in child mortality and population over time for a selected country. 
-    The data combines population estimates and child mortality rates (deaths per 1,000 live births) 
-    into a unified scale by calculating the total child mortality as a proportion of the population. 
-
-    **Scaling Explanation**:
-    - The child mortality rate is computed using the formula: 
-      \[
-      \\text{Child Mortality Rate} = \\frac{\\text{Child Mortality (per 1,000 live births)} \\times \\text{Population}}{1,000}
-      \]
-    - Both metrics are plotted on the same y-axis to enable direct comparison, providing a holistic view of population and child mortality trends.
-    - Data is shown in 20-year intervals for better clarity and simplicity.
-""")
-
 if selected_country:
     mortality_country = child_mortality[child_mortality['country'] == selected_country].melt(
         id_vars='country', var_name='year', value_name='child_mortality'
@@ -52,4 +37,41 @@ if selected_country:
     )
 
     merged_country_data = pd.merge(mortality_country, population_country, on=['country', 'year'], how='inner')
+    merged_country_data['year'] = merged_country_data['year'].astype(int)
+    merged_country_data = merged_country_data[merged_country_data['year'] % 20 == 0]
+    merged_country_data['child_mortality_rate'] = (
+        merged_country_data['child_mortality'] * merged_country_data['population'] / 1_000
+    )
+
+    st.subheader("About the Visualization")
+    st.write("""
+        This visualization explores the trends in child mortality and population over time for a selected country. 
+        The data combines population estimates and child mortality rates (deaths per 1,000 live births) 
+        into a unified scale by calculating the total child mortality as a proportion of the population. 
+
+        **Scaling Explanation**:
+        - The child mortality rate is computed using the formula: 
+          \[
+          \\text{Child Mortality Rate} = \\frac{\\text{Child Mortality (per 1,000 live births)} \\times \\text{Population}}{1,000}
+          \]
+        - Both metrics are plotted on the same y-axis to enable direct comparison, providing a holistic view of population and child mortality trends.
+        - Data is shown in 20-year intervals for better clarity and simplicity.
+    """)
+
+    chart = alt.Chart(merged_country_data).transform_fold(
+        ['child_mortality_rate', 'population'],
+        as_=['Metric', 'Value']
+    ).mark_line(point=True).encode(
+        x=alt.X('year:O', title='Year (Every 20 Years)', axis=alt.Axis(labelAngle=0)),
+        y=alt.Y('Value:Q', title='Value (Scaled)', scale=alt.Scale(type='linear')),
+        color=alt.Color('Metric:N', title='Metrics', legend=alt.Legend(orient='top')),
+        tooltip=['year', 'Metric:N', 'Value:Q']
+    ).properties(
+        width=800,
+        height=400,
+        title=f"Child Mortality Rate and Population Trends in {selected_country} (Every 20 Years)"
+    )
 
+    st.altair_chart(chart, use_container_width=True)
+else:
+    st.warning("Please select a country to view the trends.")