Update app.py

app.py

@@ -1,48 +1,62 @@
 import gradio as gr
 import random
+import time
+import plotly.graph_objects as go
+from datetime import datetime
 
-# Ahantu na info
 locations = {
-    "Downtown": {"lat": -1.95, "lon": 30.05, "avg_speed": 30, "avg_vehicles": 60},
-    "Highway": {"lat": -1.92, "lon": 30.06, "avg_speed": 100, "avg_vehicles": 40},
-    "Industrial Area": {"lat": -1.94, "lon": 30.07, "avg_speed": 50, "avg_vehicles": 30},
-    "School Zone": {"lat": -1.93, "lon": 30.03, "avg_speed": 20, "avg_vehicles": 20}
+    "Downtown": {"lat": -1.95, "lon": 30.05},
+    "Highway": {"lat": -1.92, "lon": 30.06},
+    "Industrial Area": {"lat": -1.94, "lon": 30.07},
+    "School Zone": {"lat": -1.93, "lon": 30.03}
 }
 
-def simulate_all_traffic():
+# Global history logs
+traffic_log = {loc: {"time": [], "speed": [], "vehicles": []} for loc in locations}
+
+def update_traffic():
     report_lines = []
     markers = ""
 
+    now = datetime.now().strftime("%H:%M:%S")
+
     for name, info in locations.items():
-        # Random traffic values
-        speed = round(random.gauss(info["avg_speed"], 10), 1)
-        vehicle_count = int(random.gauss(info["avg_vehicles"], 10))
+        # Random simulation
+        speed = round(random.gauss(30, 15), 1)
+        vehicle_count = int(random.gauss(40, 20))
 
-        # Traffic level + color
+        # Save to history
+        traffic_log[name]["time"].append(now)
+        traffic_log[name]["speed"].append(speed)
+        traffic_log[name]["vehicles"].append(vehicle_count)
+
+        # Decide traffic level
         if speed < 20 and vehicle_count > 50:
-            level = "🚦 High Traffic"
+            level = "🚦 High"
             color = "red"
+            alert = f"🚨 Warning: Heavy traffic in {name}"
         elif speed < 40 or vehicle_count > 40:
             level = "⚠️ Moderate"
             color = "orange"
+            alert = f"⚠️ Caution: Moderate traffic in {name}"
         else:
             level = "✅ Light"
             color = "green"
+            alert = f"✅ {name} traffic is normal"
 
-        report_lines.append(f"📍 {name}: {level} — {speed} km/h, {vehicle_count} vehicles")
+        report_lines.append(f"{alert} — {speed} km/h, {vehicle_count} cars")
 
-        # Add marker for this location
+        # Leaflet marker
         markers += f"""
         L.circleMarker([{info["lat"]}, {info["lon"]}], {{
-            color: '{color}',
-            radius: 10
+            color: '{color}', radius: 10
         }}).addTo(map).bindPopup("<b>{name}</b><br>Speed: {speed} km/h<br>Cars: {vehicle_count}<br>Status: {level}");"""
 
-    # Map HTML with all markers
+    # HTML map view
     html = f"""
-    <div id="map" style="width:100%;height:500px;"></div>
-    <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css"/>
-    <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
+    <div id='map' style='width:100%;height:500px;'></div>
+    <link rel='stylesheet' href='https://unpkg.com/leaflet/dist/leaflet.css'/>
+    <script src='https://unpkg.com/leaflet/dist/leaflet.js'></script>
     <script>
       var map = L.map('map').setView([-1.935, 30.05], 13);
       L.tileLayer('https://{{s}}.tile.openstreetmap.org/{{z}}/{{x}}/{{y}}.png', {{
@@ -52,17 +66,35 @@ def simulate_all_traffic():
       {markers}
     </script>
     """
+    return "\n".join(report_lines), html, create_traffic_chart()
 
-    return "\n".join(report_lines), html
+def create_traffic_chart():
+    fig = go.Figure()
+    for name in locations:
+        fig.add_trace(go.Scatter(
+            x=traffic_log[name]["time"],
+            y=traffic_log[name]["vehicles"],
+            mode="lines+markers",
+            name=name
+        ))
+    fig.update_layout(title="Traffic History (Vehicles Count Over Time)",
+                      xaxis_title="Time",
+                      yaxis_title="Number of Vehicles",
+                      height=400)
+    return fig
 
 with gr.Blocks() as demo:
-    gr.Markdown("## 🗺️ Advanced Traffic Map Simulation with Real-Time Markers")
+    gr.Markdown("## 🚦 Smart Traffic Monitor with Map, Alerts & Charts")
+
+    with gr.Row():
+        live_btn = gr.Button("🔁 Refresh Traffic Now")
+        report_box = gr.Textbox(label="🧾 Alerts & Reports", lines=10)
 
-    simulate = gr.Button("Simulate Traffic Across All Locations")
-    report = gr.Textbox(label="Traffic Report", lines=8)
-    map_html = gr.HTML()
+    with gr.Row():
+        map_box = gr.HTML()
+        chart_box = gr.Plot()
 
-    simulate.click(fn=simulate_all_traffic, inputs=[], outputs=[report, map_html])
+    live_btn.click(fn=update_traffic, inputs=[], outputs=[report_box, map_box, chart_box])
 
 demo.launch()