作者 | AJ Gordon

責編 | Carol

頭圖 | CSDN? 付費下載于視覺中國

出品 | CSDN云計算（ID：CSDNcloud）

本文主要介紹如何利用Python的Streamlit庫和Heroku云平臺來做一個交互式數據分析Web應用。開發環境如下：

• Windows10系統

• Anaconda3（python3.7.4）

• Git（2.26.0.windows.1）

• Heroku賬號

• 梯子（Heroku需翻墻才可訪問）

Streamlit

根據Streamlit官方文檔介紹，它是一個開放源代碼的Python庫，可以輕松地為機器學習和數據科學構建漂亮的自定義web應用程序。也就是說，即使你對web開發并不熟悉，但只要利用它，就可以很容易搭建出一個Web。

通過“pip install streamlit”進行安裝，再執行“streamlit hello”。若安裝成功，默認瀏覽器會自動打開或輸入“localhost:8501”，會彈出如下圖界面。

圖1?安裝成功界面

Streamlit用于數據可視化的話，主要模塊有：Cache，Interactive widgets，Charts。

1)?Cache

Streamlit遵循由上至下的運行順序，所以每次代碼中有進行任何更改，都會重新開始運行一遍，會十分耗時。@st.cache會對封裝起來的函數進行緩存，避免二次加載。如果函數中的代碼發生變動，cache會重新加載一遍并緩存起來。假如將代碼還原到上一次版本，由于先前的數據已經緩存起來了，所以不會進行二次加載。

import?streamlit?as?st import?timest.write("Loading....") start_time?=?time.clock() @st.cache() def?expensive_computation(a,?b):time.sleep(5)return?a?**?ba?=?2 b?=?21 res?=?expensive_computation(a,?b)st.write("Result:",?res) end_time?=?time.clock() st.write("耗時：%0.1f 秒"?%?(end_time-start_time))

圖2 Cache

2)?Interactive widgets

Streamlit提供多種組件，如滑塊，選擇框和按鈕等交互組件。利用組件可以靈活地展示數據，這一點類似很多BI工具提供的功能。

import?streamlit?as?st import?pandas?as?pd import?time#?按鈕 st.subheader("按鈕") if?st.button('Say?hello'):st.write('Why?hello?there') #?復選框 st.subheader("復選框") agree?=?st.checkbox('I?agree') if?agree:st.write('Great!') #?單選框 st.subheader("單選框") genre?=?st.radio("What's?your?favorite?movie?genre",('Comedy',?'Drama',?'Documentary')) if?genre?==?'Comedy':st.write('You?selected?comedy.') else:st.write("You?didn't?select?comedy.") #?選擇框 st.subheader("選擇框") option?=?st.selectbox('How?would?you?like?to?be?contacted?',('Email',?'Home?phone',?'Mobile?phone')) st.write('You?selected:',?option) #?多選框 st.subheader("多選框") options?=?st.multiselect('What?are?your?favorite?colors', ('Green',?'Yellow',?'Red',?'Blue'),'Yellow') st.write('You?selected:',?options) #?滑塊 st.subheader("滑塊") age?=?st.slider('How?old?are?you?',?0,?130,?25) st.write("I'm?",?age,?'years?old') #?數值輸入框 st.subheader("數值輸入框") number?=?st.number_input('Insert?a?number') st.write('The?current?number?is?',?number) #?加載數據 uploaded_file?=?st.file_uploader("Choose?a?CSV?file",?type="csv") if?uploaded_file?is?not?None:data?=?pd.read_csv(uploaded_file)st.write(data) #?進度條 my_bar?=?st.progress(0) for?percent_complete?in?range(100):time.sleep(0.1)my_bar.progress(percent_complete?+?1)

圖3 Interactive widgets?

3)?Charts

Streamlit圖庫底層基于Matplotlib庫搭建，一些常見的圖表如折線圖，條形圖，關系圖等，都可以直接傳遞數據生成圖表。此外還增加了deck.gl，可以用于繪制3D地圖。

import?streamlit?as?st import?pandas?as?pd import?numpy?as?np #?折線圖 st.subheader("折線圖") chart_data?=?pd.DataFrame(np.random.randn(20,?3),columns=['a',?'b',?'c'])st.line_chart(chart_data) #?面積圖 st.subheader("面積圖") chart_data?=?pd.DataFrame(np.random.randn(20,?3),columns=['a',?'b',?'c'])st.area_chart(chart_data) #?條形圖 st.subheader("條形圖") chart_data?=?pd.DataFrame(np.random.randn(50,?3),columns=["a",?"b",?"c"])st.bar_chart(chart_data) #?3D圖 st.subheader("3D圖") df?=?pd.DataFrame(np.random.randn(1000,?2)?/?[50,?50]?+?[37.76,?-122.4],columns=['lat',?'lon'])st.deck_gl_chart(viewport={'latitude':?37.76,'longitude':?-122.4,'zoom':?11,'pitch':?50,},layers=[{'type':?'HexagonLayer','data':?df,'radius':?200,'elevationScale':?4,'elevationRange':?[0,?1000],'pickable':?True,'extruded':?True,},?{'type':?'ScatterplotLayer','data':?df,}]) #?關系圖 st.subheader("關系圖") st.graphviz_chart('''digraph?{run?->?intrintr?->?runblrunbl?->?runrun?->?kernelkernel?->?zombiekernel?->?sleepkernel?->?runmemsleep?->?swapswap?->?runswaprunswap?->?newrunswap?->?runmemnew?->?runmemsleep?->?runmem} ''') #?地圖 st.subheader("地圖") df?=?pd.DataFrame(np.random.randn(1000,?2)?/?[50,?50]?+?[37.76,?-122.4],columns=['lat',?'lon'])st.map(df)

圖4 Charts?

Heroku

Heroku是一個支持多種編程語言的云平臺，如Java，Node.js和Python等等。注冊賬號需要翻墻，并且需使用gmail郵箱注冊。用戶每月可享受1000小時免費時長，以及512M內存，若應用超過30分鐘沒訪問會自動休眠，重新訪問即可喚醒。然后，需要下載Heroku CLI命令行工具，下載以后可以使用命令行直接部署。

圖5 Heroku支持的語言

圖6?Heroku CLI下載頁面

?

應用部署實例

首先，新建一個文件“Streamlit_Demo.py”。

import?streamlit?as?st import?pandas?as?pd import?numpy?as?npst.title('Uber?pickups?in?NYC')DATE_COLUMN?=?'date/time' DATA_URL?=?('https://s3-us-west-2.amazonaws.com/''streamlit-demo-data/uber-raw-data-sep14.csv.gz')@st.cache def?load_data(nrows):data?=?pd.read_csv(DATA_URL,?nrows=nrows)lowercase?=?lambda?x:?str(x).lower()data.rename(lowercase,?axis='columns',?inplace=True)data[DATE_COLUMN]?=?pd.to_datetime(data[DATE_COLUMN])return?datadata_load_state?=?st.text('Loading?data...') data?=?load_data(100) data_load_state.text("Done!?(using?st.cache)")if?st.checkbox('Show?raw?data'):st.subheader('Raw?data')st.write(data)st.subheader('Number?of?pickups?by?hour') hist_values?=?np.histogram(data[DATE_COLUMN].dt.hour,?bins=24,?range=(0,24))[0] st.bar_chart(hist_values)hour_to_filter?=?st.slider('hour',?0,?23,?17) filtered_data?=?data[data[DATE_COLUMN].dt.hour?==?hour_to_filter]st.subheader('Map?of?all?pickups?at?%s:00'?%?hour_to_filter) st.map(filtered_data)

然后，再新建三個文件：Procfile，requirements.txt，setup.sh。這三個文件是部署Streamlit必備的，缺一不可。

1)?Procfile

#代碼的執行語句web:?sh?setup.sh?&&?streamlit?run?Streamlit_Demo.py

2)?requirements.txt

#?代碼所需的庫及其版本streamlit==0.56.0pandas==0.25.1numpy==1.16.5

3)?setup.sh

#?配置mkdir?-p?~/.streamlit/echo?"\[server]\n\headless?=?true\n\port?=?$PORT\n\enableCORS?=?false\n\\n\"?>?~/.streamlit/config.toml

最后，配置文件和代碼準備好后，可以保存在本機demo路徑下。再按照以下步驟進行部署：

1)?進入項目路徑，先登錄heroku，輸入“heroku login”后按下空格鍵，默認瀏覽器會自動打開，輸入heroku賬號和密碼后關閉即可。

cd?demoheroku?login

2)?創建一個新應用，輸入”heroku create xx”，heroku規定應用名稱開頭結尾只能是小寫字母，并且全名只能包含小寫字母，數字和破折號。也可以只輸入”heroku create”，會自動命名一個應用。

heroku?create?streamlit-demo-01#?或者#?heroku?create

3)?初始化git代碼庫，并遠程操控heroku。

git?initheroku?git:remote?–a?streamlit-demo-01git?add?.git?commit?-m?"Initialize?Project"#?若git出現"git?Please?tell?me?who?you?are."，運行以下兩條命令，再重新執行commit:#?git?config?user.name?"heroku用戶名"#?git?config?user.email?"heroku注冊郵箱"

4)?上傳代碼到heroku代碼庫。

git?push?heroku?master

5)?執行”heroku open”打開部署好的應用，若打開后出現”?Application error”，需要自行排查是否缺失文件或文件內容有誤，筆者一開始因為缺少”setup.sh”文件導致部署失敗。另外，筆者直接從github clone后也會報錯，所以是在本機新建文件和文件夾的，項目有上傳至“

https://github.com/guoxulong/streamlit_demo

heroku?open

6)?部署完成后，輸入“https://streamlit-demo-01.herokuapp.com/”（需翻墻）就能夠訪問這個Web。?

圖7 部署完成界面

總結

總體上來講，相比較用Django框架開發Web，Streamlit開發一個交互式應用會更輕松，雖然功能還不完善，但對于數據分析可視化來說已經滿足了，而且只需要掌握Streamlit庫的用法就可以實現。

作者簡介：

AJ Gordon，對爬蟲/機器學習/數據建模/可視化均有所涉獵的數據分析師

【END】

推薦閱讀

• 一文帶你從頭認識什么是「緩存」！
  

• 在 520 這天，竟然有人把 Docker講清楚了？ | 原力計劃

• 如何使用 SQL Server FILESTREAM 存儲非結構化數據？這篇文章告訴你！

• 平安科技王健宗：所有 AI 前沿技術，都可以在聯邦學習中大展身手！

• 踢翻這碗狗糧：程序員花 7 個月敲出 eBay，只因女票喜歡糖果盒！

• 又一年5.20，用Python助力程序員脫單大攻略（視頻版）

• 斗地主嗎？能學區塊鏈那種！ | 原力計劃

真香，朕在看了！

總結

以上是生活随笔為你收集整理的实操来了！一文告诉你如何用 Streamlit 和 Heroku 开发 Web的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。