Update app.py

app.py

@@ -1,9 +1,11 @@
 import streamlit as st
-import leafmap.foliumap as leafmap
+import pydeck as pdk
+import pandas as pd
 import geopandas as gpd
 import json
+from shapely.geometry import mapping
 
-# Function to load GeoJSON data
+# Load GeoJSON data function
 @st.cache
 def load_geojson_data(file_paths):
     geodata = []
@@ -12,20 +14,7 @@ def load_geojson_data(file_paths):
         geodata.append(gdf)
     return geodata
 
-# Function to generate heatmap data from polygons
-def generate_heatmap_data(gdfs):
-    heatmap_data = []
-    for gdf in gdfs:
-        for _, row in gdf.iterrows():
-            if row.geometry.type == 'Polygon':
-                x, y = row.geometry.centroid.x, row.geometry.centroid.y
-                heatmap_data.append([y, x])
-            elif row.geometry.type == 'Point':
-                x, y = row.geometry.x, row.geometry.y
-                heatmap_data.append([y, x])
-    return heatmap_data
 
-# Placeholder for polygon GeoJSON
 polygon_geojson = json.loads("""
 {
   "type": "FeatureCollection",
@@ -42,66 +31,64 @@ polygon_geojson = json.loads("""
 }
 """)
 
-# Sidebar for input
+# Sidebar
 st.sidebar.title("Geospatial Data Visualization")
 timestamp = st.sidebar.select_slider("Time", options=[f"{year}-01" for year in range(2016, 2024)])
 
 # Main title
-st.title("Heatmap view:")
+st.title("Heatmap and Polygon view:")
 
-# Load your GeoJSON files
-geojson_file_paths = ['/mnt/data/kathajodi_centroids.geojson']
+
+geojson_file_paths = ['kathajodi_centroids.geojson','chambal_centroids.geojson']
 geojson_data = load_geojson_data(geojson_file_paths)
 
-# Create a Leafmap map with satellite basemap
-m = leafmap.Map(center=[27.5, 79.5], zoom=6, basemap="SATELLITE")
+# Combine all geodata into one DataFrame for Pydeck
+all_geo_data = pd.concat(geojson_data + [gpd.GeoDataFrame.from_features(polygon_geojson["features"])])
+all_geo_data['lon'] = all_geo_data.geometry.centroid.x
+all_geo_data['lat'] = all_geo_data.geometry.centroid.y
+
+# Pydeck Layer for Polygons
+polygon_layer = pdk.Layer(
+    "PolygonLayer",
+    all_geo_data,
+    get_polygon="geometry.coordinates",
+    get_fill_color="[200, 30, 0, 160]",
+    get_line_color=[0, 0, 0],
+    pickable=True,
+    auto_highlight=True
+)
 
-# Add GeoJSON data to the map
-for gdf in geojson_data:
-    m.add_gdf(gdf, layer_name="GeoData")
+# Pydeck Layer for Heatmap
+heatmap_layer = pdk.Layer(
+    "HeatmapLayer",
+    all_geo_data,
+    get_position=['lon', 'lat'],
+    aggregation=pdk.types.String("MEAN"),
+    opacity=0.5
+)
 
-# Add the polygon GeoJSON
-polygon_gdf = gpd.GeoDataFrame.from_features(polygon_geojson["features"])
-m.add_gdf(polygon_gdf, layer_name="Polygon")
+# Set the viewport location
+view_state = pdk.ViewState(
+    latitude=27.5,
+    longitude=79.5,
+    zoom=6,
+    pitch=0
+)
 
-# Generate heatmap data and add heatmap
-heatmap_data = generate_heatmap_data(geojson_data + [polygon_gdf])
-m.add_heatmap(heatmap_data, radius=20)
+# Render the map using Pydeck
+r = pdk.Deck(
+    layers=[polygon_layer, heatmap_layer],
+    initial_view_state=view_state,
+    map_style='mapbox://styles/mapbox/satellite-v9'
+)
 
-# Display the map 
-m.to_streamlit(height=600)
+# Display the map in Streamlit
+st.pydeck_chart(r)
 
 # Add an informational box
 with st.expander("View Information"):
     st.write(f"Selected Time: {timestamp}")
-    num_points = sum(len(gdf) for gdf in geojson_data)
-    total_area = sum(gdf.geometry.area.sum() for gdf in geojson_data)  # Customize as needed.
+    num_points = len(all_geo_data)
+    total_area = all_geo_data.geometry.area.sum()  # Customize as needed.
     st.write(f"Number of Features: {num_points}")
     st.write(f"Total Area: {total_area:.2f} sq km")
-
-
-css_code = """
-<style>
-.fixed-box {
-    position: fixed;
-    top: 50px;
-    right: 50px;
-    width: 200px;
-    background-color: white;
-    padding: 10px;
-    border: 1px solid black;
-    z-index: 100;
-}
-</style>
-"""
-
-st.markdown(css_code, unsafe_allow_html=True)
-st.markdown(
-    f"""
-    <div class="fixed-box">
-        <strong>Summary Stats:</strong>
-        <p>Number of Features: {num_points}</p>
-        <p>Total Area: {total_area:.2f} sq km</p>
-    </div>
-    """, unsafe_allow_html=True
-)