使用 Streamlit 製作3D 地圖資料科學APP - 1

Streamlit 在幾分鐘內將數據腳本轉換為可共享的 Web 應用程序。
全部使用純 Python。無需前端經驗。

不久前才被snowflake收購

GitHub - streamlit/demo-uber-nyc-pickups: A Streamlit demo to interactively visualize Uber pickups…
A Streamlit demo to interactively visualize Uber pickups in New York City - GitHub - streamlit/demo-uber-nyc-pickups: A…github.com

pip install — upgrade streamlit 
streamlit run https://raw.githubusercontent.com/streamlit/demo-uber-nyc-pickups/main/streamlit_app.py

使用上述指令會出現錯誤

改成

git clone https://github.com/streamlit/demo-uber-nyc-pickups.git

cd demo-uebr-nyc-pickups 

pip install -r requirements.txt

streamlit run streamlit_app.py

這邊先預設您已經使用了anaconda的環境

生成端口 8501

數據集

Uber Pickups in New York City
Trip data for over 20 million Uber (and other for-hire vehicle) trips in NYCwww.kaggle.com

此APP預設擷取10000筆資料

可以取消nrows=10000這項參數導入全部數據

app讀取時間如果拉長的話

或是一直都是running

試著重啟APP

# LOAD DATA ONCE

@st.experimental_singleton

def load_data():

data = pd.read_csv(

“uber-raw-data-sep14.csv.gz”,

nrows=10000, # approx. 10% of data

names=[

“date/time”,

“lat”,

“lon”,

], # specify names directly since they don’t change

skiprows=1, # don’t read header since names specified directly

usecols=[0, 1, 2], # doesn’t load last column, constant value “B02512”

parse_dates=[

“date/time”

], # set as datetime instead of converting after the fact

)

return data

導入模組

import streamlit as st

import pandas as pd

import numpy as np

import altair as alt

import pydeck as pdk

頁面內容應該如何佈局。默認為“centered”，將元素約束為固定寬度的居中列；“wide”使用整個屏幕。

st.set_page_config(layout=”wide”)

存儲單例對象的函數裝飾器

@st.experimental_singleton

# LAYING OUT THE TOP SECTION OF THE APP

row1_1, row1_2 = st.columns((2, 3))

with row1_1:

st.title(“NYC Uber Ridesharing Data”)

hour_selected = st.slider(“Select hour of pickup”, 0, 23)

with row1_2:

st.write(

“””

##

Examining how Uber pickups vary over time in New York City’s and at its major regional airports.

By sliding the slider on the left you can view different slices of time and explore different transportation trends.

“””

)

以上程式碼對應下圖功能

# LAYING OUT THE MIDDLE SECTION OF THE APP WITH THE MAPS

row2_1, row2_2, row2_3, row2_4 = st.columns((2, 1, 1, 1))

# SETTING THE ZOOM LOCATIONS FOR THE AIRPORTS

la_guardia = [40.7900, -73.8700]

jfk = [40.6650, -73.7821]

newark = [40.7090, -74.1805]

zoom_level = 12

midpoint = mpoint(data[“lat”], data[“lon”])

with row2_1:

st.write(

f”””**All New York City from {hour_selected}:00 and {(hour_selected + 1) % 24}:00**”””

)

map(filterdata(data, hour_selected), midpoint[0], midpoint[1], 11)

with row2_2:

st.write(“**La Guardia Airport**”)

map(filterdata(data, hour_selected), la_guardia[0], la_guardia[1], zoom_level)

with row2_3:

st.write(“**JFK Airport**”)

map(filterdata(data, hour_selected), jfk[0], jfk[1], zoom_level)

with row2_4:

st.write(“**Newark Airport**”)

map(filterdata(data, hour_selected), newark[0], newark[1], zoom_level)

以上程式碼對應下圖功能

產生pydeck提供的地圖套件

# CALCULATING DATA FOR THE HISTOGRAM

chart_data = histdata(data, hour_selected)

# LAYING OUT THE HISTOGRAM SECTION

st.write(

f”””**Breakdown of rides per minute between {hour_selected}:00 and {(hour_selected + 1) % 24}:00**”””

)

st.altair_chart(

alt.Chart(chart_data)

.mark_area(

interpolate=”step-after”,

)

.encode(

x=alt.X(“minute:Q”, scale=alt.Scale(nice=False)),

y=alt.Y(“pickups:Q”),

tooltip=[“minute”, “pickups”],

)

.configure_mark(opacity=0.2, color=”red”),

use_container_width=True,

)

以上程式碼對應下圖功能

#再導入以下模組

#這個模組可以使用PANDAS進行快速探索性數據分析

import pandas_profiling #元套件

#st的組件

from streamlit_pandas_profiling import st_profile_report 

pandas profiling 模組可以使用PANDAS進行快速探索性數據分析

pr = data.profile_report()

st_profile_report(pr)

CTRL+S 儲存

便會生成以下資訊

• 類型推斷：檢測數據框中列的類型。
• 要點：類型、唯一值、缺失值
• 分位數統計，例如最小值、Q1、中位數、Q3、最大值、範圍、四分位間距
• 描述性統計，如均值、眾數、標準差、總和、中值絕對差、變異係數、峰度、偏度
• 最常見的值
• 直方圖
• 突出高度相關變量、Spearman、Pearson 和 Kendall 矩陣的相關性
• 缺失值矩陣、計數、熱圖和缺失值樹狀圖
• 文本分析了解文本數據的類別（大寫、空格）、腳本（拉丁文、西里爾文）和塊 (ASCII)。
• 文件和圖像分析提取文件大小、創建日期和尺寸，並掃描截斷的圖像或包含 EXIF 信息的圖像。

如果我的文章對你幫助

請給我一點掌聲

謝謝!

作者：黃翊鈜 Roy Hwang

經歷：ML engineer , AI engineer