map interactive

app.py

@@ -7,6 +7,7 @@
 
 import altair as alt
 import pandas as pd
+import pydeck as pdk
 import streamlit as st
 
 st.title('Group 5 Final Project - Part 2 (Dashboard)')
@@ -91,14 +92,43 @@ filtered_data['Longitude'] = pd.to_numeric(filtered_data['Longitude'], errors='c
 
 filtered_data = filtered_data.dropna(subset=['Latitude', 'Longitude'])
 filtered_data.rename(columns={'Latitude': 'latitude', 'Longitude': 'longitude'}, inplace=True)
-st.map(filtered_data[['latitude', 'longitude']])
+# st.map(filtered_data[['latitude', 'longitude']])
+
+st.pydeck_chart(pdk.Deck(
+    # map_style='mapbox://styles/mapbox/light-v9',
+    initial_view_state=pdk.ViewState(
+        latitude=filtered_data['latitude'].mean(),
+        longitude=filtered_data['longitude'].mean(),
+        zoom=10,
+        # pitch=50,
+    ),
+    layers=[
+        pdk.Layer(
+            'ScatterplotLayer',
+            data=filtered_data,
+            get_position='[longitude, latitude]',
+            get_radius=200,
+            get_color='[200, 30, 0, 160]',
+            pickable=True
+        )
+    ],
+    tooltip={
+        "html": "<b>Make:</b> {Make}<br/><b>Model:</b> {Model}<br/><b>Electric Range:</b> {Electric Range}",
+        "style": {
+            "backgroundColor": "steelblue",
+            "color": "white"
+        }
+    }
+))
 
 st.markdown('''### How to Use This Dashboard
 To explore the dataset, use the sidebar options to filter by county and make. The filtered dataset is displayed in the 
 table, and corresponding charts will help you explore the distribution of electric vehicle types, their electric ranges, 
 and model years. The map also provides a visualization of the locations of the vehicles in the selected county.
 
-All charts are interactive. You can click on bars to highlight corresponding data points in other charts, making it easier to discover patterns and relationships.''')
+All charts are interactive. You can click on bars to highlight corresponding data points in other charts, making it easier to discover patterns and relationships.
+
+The map is also interactive; you can zoom in, rotate, and click on points to see additional information about each vehicle.''')
 
 st.markdown('''### Contextual Datasets
 A potentially useful contextual dataset could be the [Electric Charging Stations Locations](https://afdc.energy.gov/fuels/electricity_locations.html).

poetry.lock

@@ -1183,4 +1183,4 @@ watchmedo = ["PyYAML (>=3.10)"]
 [metadata]
 lock-version = "2.0"
 python-versions = "^3.12"
-content-hash = "62f77c99720591500a8c0b30deb93a63cb5c61df42a2f02b199bd247d82c8266"
+content-hash = "bd2d59f3fedd9cab57202c080d3ce049a5ad2a45273c567e6aad87cd58d1ebca"

pyproject.toml

@@ -11,6 +11,7 @@ python = "^3.12"
 streamlit = "^1.40.0"
 altair = "^5.4.1"
 vega-datasets = "^0.9.0"
+pydeck = "^0.9.1"
 
 
 [build-system]