Merge branch 'main' of https://huggingface.co/spaces/mihkelmj/utrecht-pollution-prediction

app.py

@@ -112,9 +112,8 @@ with col2:
             )
 
     # Create two columns for two separate graphs
-    # Plot O3 in the first subcolumn
     st.subheader("O3 Forecast")
-    # Plot NO2 in the second subcolumn
+
     # Define the new color logic: green, orange, and red based on the threshold
     def get_simple_color_scale(values, threshold):
         """Returns green for values below the threshold, orange for values between the threshold and 2x the threshold, and red for values above 2x the threshold."""
@@ -125,18 +124,35 @@ with col2:
         ]
 
     # O3 Bar Plot (threshold: 40)
-    o3_colors = get_simple_color_scale(o3_values, 40)  # Green below 40, Orange above 40, Red above 80
+    o3_past_values = o3_values[:-3]  # Last 3 values are predictions
+    o3_future_values = o3_values[-3:]  # Last 3 values are predictions
+    o3_colors = get_simple_color_scale(o3_past_values, 40)  # Color for past values
 
     fig_o3 = go.Figure()
+
+    # Add past values
     fig_o3.add_trace(
         go.Bar(
-            x=df["Date"],
-            y=df["O3"],
-            name="O3",
+            x=df["Date"][:-3],  # Dates for past values
+            y=o3_past_values,
+            name="O3 Past",
             marker=dict(color=o3_colors),  # Apply the color scale
             hovertemplate="%{x|%d-%b-%Y}<br>%{y} µg/m³<extra></extra>",
         )
     )
+
+    # Add predicted values with reduced opacity
+    predicted_o3_colors = get_simple_color_scale(o3_future_values, 40)  # Color for future values
+    fig_o3.add_trace(
+        go.Bar(
+            x=df["Date"][-3:],  # Dates for predicted values
+            y=o3_future_values,
+            name="O3 Predicted",
+            marker=dict(color=predicted_o3_colors, opacity=0.5),  # Set opacity to 0.5 for predictions
+            hovertemplate="%{x|%d-%b-%Y}<br>%{y} µg/m³<extra></extra>",
+        )
+    )
+
     fig_o3.add_shape(
         dict(
             type="line",
@@ -147,6 +163,7 @@ with col2:
             line=dict(color="White", width=3, dash="dash"),
         )
     )
+
     fig_o3.update_layout(
         plot_bgcolor="rgba(0, 0, 0, 0)",
         paper_bgcolor="rgba(0, 0, 0, 0)",
@@ -162,22 +179,42 @@ with col2:
             tickangle=-45,
             tickcolor="gray",
         ),
+        showlegend=False  # Disable legend
     )
+
     st.plotly_chart(fig_o3, key="fig_o3")
 
     # NO2 Bar Plot (threshold: 120)
-    no2_colors = get_simple_color_scale(no2_values, 120)  # Green below 120, Orange above 120, Red above 240
     st.subheader("NO2 Forecast")
+    no2_past_values = no2_values[:-3]  # Last 3 values are predictions
+    no2_future_values = no2_values[-3:]  # Last 3 values are predictions
+    no2_colors = get_simple_color_scale(no2_past_values, 120)  # Color for past values
+
     fig_no2 = go.Figure()
+
+    # Add past values
     fig_no2.add_trace(
         go.Bar(
-            x=df["Date"],
-            y=df["NO2"],
-            name="NO2",
+            x=df["Date"][:-3],  # Dates for past values
+            y=no2_past_values,
+            name="NO2 Past",
             marker=dict(color=no2_colors),  # Apply the color scale
             hovertemplate="%{x|%d-%b-%Y}<br>%{y} µg/m³<extra></extra>",
         )
     )
+
+    # Add predicted values with reduced opacity
+    predicted_no2_colors = get_simple_color_scale(no2_future_values, 120)  # Color for future values
+    fig_no2.add_trace(
+        go.Bar(
+            x=df["Date"][-3:],  # Dates for predicted values
+            y=no2_future_values,
+            name="NO2 Predicted",
+            marker=dict(color=predicted_no2_colors, opacity=0.5),  # Set opacity to 0.5 for predictions
+            hovertemplate="%{x|%d-%b-%Y}<br>%{y} µg/m³<extra></extra>",
+        )
+    )
+
     fig_no2.add_shape(
         dict(
             type="line",
@@ -188,6 +225,7 @@ with col2:
             line=dict(color="White", width=3, dash="dash"),
         )
     )
+
     fig_no2.update_layout(
         plot_bgcolor="rgba(0, 0, 0, 0)",
         paper_bgcolor="rgba(0, 0, 0, 0)",
@@ -203,28 +241,7 @@ with col2:
             tickangle=-45,
             tickcolor="gray",
         ),
+        showlegend=False  # Disable legend
     )
-    st.plotly_chart(fig_no2, key="fig_no2")
-
-    import matplotlib.pyplot as plt
-    import numpy as np
-
-    fig, ax = plt.subplots()
-
-    bar = ax.bar([1,2,3,4,5,6],[4,5,6,3,7,5])
-
-    def gradientbars(bars):
-        grad = np.atleast_2d(np.linspace(0,1,256)).T
-        ax = bars[0].axes
-        lim = ax.get_xlim()+ax.get_ylim()
-        for bar in bars:
-            bar.set_zorder(1)
-            bar.set_facecolor("none")
-            x,y = bar.get_xy()
-            w, h = bar.get_width(), bar.get_height()
-            ax.imshow(grad, extent=[x,x+w,y,y+h], aspect="auto", zorder=0)
-        ax.axis(lim)
-
-    gradientbars(bar)
 
-    plt.show() 
+    st.plotly_chart(fig_no2, key="fig_no2")

pollution_data.csv

@@ -11,5 +11,5 @@ date,NO2,O3
 2024-10-26,24.46423484380123,18.70331123489324
 2024-10-27,27.53722134983982,20.80809239842384
 2024-10-28,23.337567567567568,26.82861788617886
-2024-10-29,16.53533209586906,23.282548876050039
-2024-10-30,22.26162162162162,18.034435483870976
+2024-10-29,16.53533209586906,23.28254887605004
+2024-10-30,22.26162162162162,18.03443548387097

predictions_history.csv

@@ -70,4 +70,3 @@ NO2,2024-10-30,2024-10-31,29.77507241979599
 O3,2024-10-30,2024-11-01,21.135906183680472
 NO2,2024-10-30,2024-11-01,28.38872595850704
 O3,2024-10-30,2024-11-02,19.67426015042635
-NO2,2024-10-30,2024-11-02,25.564317135035058

weather_data.csv

@@ -9,7 +9,7 @@ date,temp,humidity,precip,windspeed,sealevelpressure,visibility,solarradiation
 2024-10-24,10.4,94.0,0.0,20.5,1024.7,13.0,62.5
 2024-10-25,13.6,92.2,0.5,11.9,1016.8,24.0,93.0
 2024-10-26,13.7,91.5,0.0,11.9,1016.3,23.3,8.0
-2024-10-27,12.0,90.9,0.1,13.7,1019.6,23.7,28.6
-2024-10-28,10.5,92.8,1.7,19.4,1022.7,24.0,28.2
+2024-10-27,13.2,87.1,0.1,20.5,1019.4,10.4,28.6
+2024-10-28,12.4,91.8,1.1,31.7,1021.8,12.8,27.3
 2024-10-29,13.8,95.9,0.2,20.5,1023.1,8.1,16.0
-2024-10-30,12.7,92.5,0.6,9.4,1027.5,13.7,32.9
+2024-10-30,12.7,92.9,0.6,9.4,1027.5,12.5,32.8