Update app.py

app.py

@@ -352,14 +352,138 @@
 
 
 
+# import streamlit as st
+# import plotly.express as px
+# from app_backend import fetch_weather, generate_synthetic_data, optimize_load
+# import pandas as pd
+
+# # Constants
+# API_KEY = "84e26811a314599e940f343b4d5894a7"  # Replace with your OpenWeather API key
+# LOCATION = "Pakistan"
+
+# # Sidebar
+# st.sidebar.title("Smart Grid Dashboard")
+# location = st.sidebar.text_input("Enter Location", LOCATION)
+
+# # Fetch and display weather data
+# weather = fetch_weather(API_KEY, location)
+# st.sidebar.subheader("Weather Information")
+# if weather:
+#     st.sidebar.write(f"**Temperature**: {weather['temperature']} °C")
+#     st.sidebar.write(f"**Wind Speed**: {weather['wind_speed']} m/s")
+#     st.sidebar.write(f"**Weather**: {weather['weather']}")
+
+# # Main tabs
+# tab1, tab2, tab3 = st.tabs(["Home", "Power Storage", "Power Trading management"])
+
+# # Home Tab
+# with tab1:
+#     st.title("Real-Time Smart Grid Dashboard")
+    
+#     # Generate synthetic data
+#     data = generate_synthetic_data()
+    
+#     # Show weather at top
+#     if weather:
+#         st.write(f"### Location: {location}")
+#         st.write(f"Temperature: {weather['temperature']} °C | Wind Speed: {weather['wind_speed']} m/s | Weather: {weather['weather']}")
+    
+#     # Power consumption graph
+#     fig = px.line(
+#         data,
+#         x="timestamp",
+#         y=["power_consumption_mw", "generation_mw", "storage_usage_mw"],
+#         labels={"value": "Power (MW)", "variable": "Metric"},
+#         title="Power Flow Over Time"
+#     )
+#     fig.update_traces(mode="lines+markers")
+#     st.plotly_chart(fig)
+    
+#     # Grid health as bar chart
+#     st.subheader("Grid Health Overview")
+#     grid_health_counts = data["grid_health"].value_counts()
+#     fig_health = px.bar(
+#         grid_health_counts,
+#         x=grid_health_counts.index,
+#         y=grid_health_counts.values,
+#         labels={"x": "Grid Status", "y": "Count"},
+#         title="Grid Health Status"
+#     )
+#     st.plotly_chart(fig_health)
+    
+#     # AI recommendations
+#     st.subheader("AI Recommendations")
+#     current_demand = data["power_consumption_mw"].iloc[-1]
+#     current_solar = data["solar_output_mw"].iloc[-1]
+#     current_wind = data["wind_output_mw"].iloc[-1]
+#     recommendation = optimize_load(current_demand, current_solar, current_wind)
+#     st.write(f"**Current Load Demand**: {current_demand} MW")
+#     st.write(f"**Solar Output**: {current_solar} MW")
+#     st.write(f"**Wind Output**: {current_wind} MW")
+#     st.write(f"**Recommendation**: {recommendation}")
+
+# # Storage Tab
+# with tab2:
+#     st.title("Energy Storage Status")
+    
+#     # Pie chart of energy percentage contribution
+#     storage_data = {
+#         "Wind": data["wind_output_mw"].mean(),
+#         "Solar": data["solar_output_mw"].mean(),
+#         "Turbine": data["turbine_output_mw"].mean()
+#     }
+#     fig_pie = px.pie(
+#         names=storage_data.keys(),
+#         values=storage_data.values(),
+#         title="Energy Contribution by Resource"
+#     )
+#     st.plotly_chart(fig_pie)
+    
+#     # Circle visualization for storage
+#     st.subheader("Total Energy Stored")
+#     total_storage = sum(storage_data.values())
+#     st.write(f"**Total Energy Stored**: {total_storage:.2f} MW")
+    
+#     st.markdown(
+#         """
+#         <div style="display: flex; justify-content: center; align-items: center; flex-direction: column;">
+#             <div style="width: 150px; height: 150px; border-radius: 50%; background-color: #FFDD00; display: flex; justify-content: center; align-items: center; font-size: 24px; font-weight: bold; margin-bottom: 20px;">
+#                 {total_storage:.2f} MW
+#             </div>
+#             <div style="display: flex; gap: 50px;">
+#                 <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #0073FF; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
+#                     Wind<br>{storage_data["Wind"]:.2f} MW
+#                 </div>
+#                 <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #FF5733; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
+#                     Solar<br>{storage_data["Solar"]:.2f} MW
+#                 </div>
+#                 <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #28B463; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
+#                     Turbine<br>{storage_data["Turbine"]:.2f} MW
+#                 </div>
+#             </div>
+#         </div>
+#         """,
+#         unsafe_allow_html=True
+#     )
+
+# # Trading Tab
+# with tab3:
+#     st.title("Electricity Trade Management")
+#     st.write("Under development...")
+
+
+
+# code 5
+
+
 import streamlit as st
+import pandas as pd
 import plotly.express as px
 from app_backend import fetch_weather, generate_synthetic_data, optimize_load
-import pandas as pd
 
 # Constants
-API_KEY = "84e26811a314599e940f343b4d5894a7"  # Replace with your OpenWeather API key
-LOCATION = "Pakistan"
+API_KEY = "YOUR_API_KEY"
+LOCATION = "New York"
 
 # Sidebar
 st.sidebar.title("Smart Grid Dashboard")
@@ -367,108 +491,84 @@ location = st.sidebar.text_input("Enter Location", LOCATION)
 
 # Fetch and display weather data
 weather = fetch_weather(API_KEY, location)
-st.sidebar.subheader("Weather Information")
 if weather:
-    st.sidebar.write(f"**Temperature**: {weather['temperature']} °C")
-    st.sidebar.write(f"**Wind Speed**: {weather['wind_speed']} m/s")
-    st.sidebar.write(f"**Weather**: {weather['weather']}")
+    st.sidebar.write(f"Temperature: {weather['temperature']} °C")
+    st.sidebar.write(f"Wind Speed: {weather['wind_speed']} m/s")
+    st.sidebar.write(f"Weather: {weather['weather']}")
 
-# Main tabs
-tab1, tab2, tab3 = st.tabs(["Home", "Power Storage", "Power Trading management"])
+# Tabs
+tab_home, tab_storage, tab_trading = st.tabs(["Home", "Storage", "Electricity Trade Management"])
 
 # Home Tab
-with tab1:
+with tab_home:
     st.title("Real-Time Smart Grid Dashboard")
-    
+
     # Generate synthetic data
     data = generate_synthetic_data()
-    
-    # Show weather at top
-    if weather:
-        st.write(f"### Location: {location}")
-        st.write(f"Temperature: {weather['temperature']} °C | Wind Speed: {weather['wind_speed']} m/s | Weather: {weather['weather']}")
-    
-    # Power consumption graph
-    fig = px.line(
-        data,
-        x="timestamp",
-        y=["power_consumption_mw", "generation_mw", "storage_usage_mw"],
-        labels={"value": "Power (MW)", "variable": "Metric"},
-        title="Power Flow Over Time"
-    )
-    fig.update_traces(mode="lines+markers")
-    st.plotly_chart(fig)
-    
-    # Grid health as bar chart
+
+    # Grid Health
     st.subheader("Grid Health Overview")
     grid_health_counts = data["grid_health"].value_counts()
-    fig_health = px.bar(
-        grid_health_counts,
-        x=grid_health_counts.index,
-        y=grid_health_counts.values,
-        labels={"x": "Grid Status", "y": "Count"},
-        title="Grid Health Status"
-    )
-    st.plotly_chart(fig_health)
-    
-    # AI recommendations
-    st.subheader("AI Recommendations")
-    current_demand = data["power_consumption_mw"].iloc[-1]
-    current_solar = data["solar_output_mw"].iloc[-1]
-    current_wind = data["wind_output_mw"].iloc[-1]
+    st.bar_chart(grid_health_counts)
+
+    # Power Consumption, Generation & Storage Graph
+    st.subheader("Power Consumption, Generation & Storage")
+    fig = px.line(data, x="timestamp", y=["load_demand_kwh", "solar_output_kw", "wind_output_kw"], 
+                  title="Power Consumption, Generation & Storage", labels={"value": "Power (MW)"})
+    fig.update_traces(line=dict(width=2))
+    st.plotly_chart(fig)
+
+    # Optimization Recommendations
+    current_demand = data["load_demand_kwh"].iloc[-1]
+    current_solar = data["solar_output_kw"].iloc[-1]
+    current_wind = data["wind_output_kw"].iloc[-1]
     recommendation = optimize_load(current_demand, current_solar, current_wind)
-    st.write(f"**Current Load Demand**: {current_demand} MW")
-    st.write(f"**Solar Output**: {current_solar} MW")
-    st.write(f"**Wind Output**: {current_wind} MW")
-    st.write(f"**Recommendation**: {recommendation}")
+
+    st.subheader("Recommendations")
+    st.write(f"Current Load Demand: {current_demand} MW")
+    st.write(f"Solar Output: {current_solar} MW")
+    st.write(f"Wind Output: {current_wind} MW")
+    st.write(f"Recommendation: {recommendation}")
 
 # Storage Tab
-with tab2:
-    st.title("Energy Storage Status")
-    
-    # Pie chart of energy percentage contribution
-    storage_data = {
-        "Wind": data["wind_output_mw"].mean(),
-        "Solar": data["solar_output_mw"].mean(),
-        "Turbine": data["turbine_output_mw"].mean()
+with tab_storage:
+    st.title("Energy Storage Overview")
+
+    # Energy Contribution by Resources
+    st.subheader("Energy Contribution Percentage by Resources")
+    energy_data = {
+        "Wind": 5,
+        "Solar": 7,
+        "Turbine": 10
     }
-    fig_pie = px.pie(
-        names=storage_data.keys(),
-        values=storage_data.values(),
-        title="Energy Contribution by Resource"
-    )
-    st.plotly_chart(fig_pie)
-    
-    # Circle visualization for storage
+    energy_df = pd.DataFrame(list(energy_data.items()), columns=["Source", "Energy (MW)"])
+    fig = px.pie(energy_df, values="Energy (MW)", names="Source", title="Energy Contribution by Resources")
+    st.plotly_chart(fig)
+
+    # Energy Storage Merge
     st.subheader("Total Energy Stored")
-    total_storage = sum(storage_data.values())
-    st.write(f"**Total Energy Stored**: {total_storage:.2f} MW")
-    
-    st.markdown(
-        """
-        <div style="display: flex; justify-content: center; align-items: center; flex-direction: column;">
-            <div style="width: 150px; height: 150px; border-radius: 50%; background-color: #FFDD00; display: flex; justify-content: center; align-items: center; font-size: 24px; font-weight: bold; margin-bottom: 20px;">
-                {total_storage:.2f} MW
-            </div>
-            <div style="display: flex; gap: 50px;">
-                <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #0073FF; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
-                    Wind<br>{storage_data["Wind"]:.2f} MW
-                </div>
-                <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #FF5733; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
-                    Solar<br>{storage_data["Solar"]:.2f} MW
-                </div>
-                <div style="width: 100px; height: 100px; border-radius: 50%; background-color: #28B463; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold;">
-                    Turbine<br>{storage_data["Turbine"]:.2f} MW
-                </div>
-            </div>
-        </div>
-        """,
-        unsafe_allow_html=True
-    )
+    st.write("Energy stored from all sources:")
+    energy_stored = sum(energy_data.values())
+    st.write(f"Total Energy Stored: {energy_stored} MW")
+    st.write("Energy sources merged into total energy storage:")
+    st.write(f"Total Energy Stored in Grid: {energy_stored} MW")
 
 # Trading Tab
-with tab3:
+with tab_trading:
     st.title("Electricity Trade Management")
-    st.write("Under development...")
+
+    # Simulating Electricity Trade (Energy cubes & trading)
+    st.subheader("Energy Trade Overview")
+    energy_trade = {
+        "USA": 50,
+        "Germany": 40,
+        "India": 30
+    }
+    trade_df = pd.DataFrame(list(energy_trade.items()), columns=["Country", "Energy (MW)"])
+    fig = px.bar(trade_df, x="Country", y="Energy (MW)", title="Energy Trading Overview")
+    st.plotly_chart(fig)
+
+    st.write("Energy cubes available for trading:")
+    st.write("The system can trade energy with other countries.")