实操来了!一文告诉你如何用 Streamlit 和 Heroku 开发 Web
作者 | AJ Gordon
責(zé)編 | Carol
頭圖 | CSDN? 付費(fèi)下載于視覺中國
出品 | CSDN云計(jì)算(ID:CSDNcloud)
本文主要介紹如何利用Python的Streamlit庫和Heroku云平臺(tái)來做一個(gè)交互式數(shù)據(jù)分析Web應(yīng)用。開發(fā)環(huán)境如下:
Windows10系統(tǒng)
Anaconda3(python3.7.4)
Git(2.26.0.windows.1)
Heroku賬號(hào)
梯子(Heroku需翻墻才可訪問)
Streamlit
根據(jù)Streamlit官方文檔介紹,它是一個(gè)開放源代碼的Python庫,可以輕松地為機(jī)器學(xué)習(xí)和數(shù)據(jù)科學(xué)構(gòu)建漂亮的自定義web應(yīng)用程序。也就是說,即使你對web開發(fā)并不熟悉,但只要利用它,就可以很容易搭建出一個(gè)Web。
通過“pip install streamlit”進(jìn)行安裝,再執(zhí)行“streamlit hello”。若安裝成功,默認(rèn)瀏覽器會(huì)自動(dòng)打開或輸入“l(fā)ocalhost:8501”,會(huì)彈出如下圖界面。
圖1?安裝成功界面
Streamlit用于數(shù)據(jù)可視化的話,主要模塊有:Cache,Interactive widgets,Charts。
1)?Cache
Streamlit遵循由上至下的運(yùn)行順序,所以每次代碼中有進(jìn)行任何更改,都會(huì)重新開始運(yùn)行一遍,會(huì)十分耗時(shí)。@st.cache會(huì)對封裝起來的函數(shù)進(jìn)行緩存,避免二次加載。如果函數(shù)中的代碼發(fā)生變動(dòng),cache會(huì)重新加載一遍并緩存起來。假如將代碼還原到上一次版本,由于先前的數(shù)據(jù)已經(jīng)緩存起來了,所以不會(huì)進(jìn)行二次加載。
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("耗時(shí):%0.1f 秒"?%?(end_time-start_time))圖2 Cache
2)?Interactive widgets
Streamlit提供多種組件,如滑塊,選擇框和按鈕等交互組件。利用組件可以靈活地展示數(shù)據(jù),這一點(diǎn)類似很多BI工具提供的功能。
import?streamlit?as?st import?pandas?as?pd import?time#?按鈕 st.subheader("按鈕") if?st.button('Say?hello'):st.write('Why?hello?there') #?復(fù)選框 st.subheader("復(fù)選框") 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') #?數(shù)值輸入框 st.subheader("數(shù)值輸入框") number?=?st.number_input('Insert?a?number') st.write('The?current?number?is?',?number) #?加載數(shù)據(jù) 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) #?進(jìn)度條 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庫搭建,一些常見的圖表如折線圖,條形圖,關(guān)系圖等,都可以直接傳遞數(shù)據(jù)生成圖表。此外還增加了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,}]) #?關(guān)系圖 st.subheader("關(guān)系圖") 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是一個(gè)支持多種編程語言的云平臺(tái),如Java,Node.js和Python等等。注冊賬號(hào)需要翻墻,并且需使用gmail郵箱注冊。用戶每月可享受1000小時(shí)免費(fèi)時(shí)長,以及512M內(nèi)存,若應(yīng)用超過30分鐘沒訪問會(huì)自動(dòng)休眠,重新訪問即可喚醒。然后,需要下載Heroku CLI命令行工具,下載以后可以使用命令行直接部署。
圖5 Heroku支持的語言
圖6?Heroku CLI下載頁面
?
應(yīng)用部署實(shí)例
首先,新建一個(gè)文件“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)然后,再新建三個(gè)文件:Procfile,requirements.txt,setup.sh。這三個(gè)文件是部署Streamlit必備的,缺一不可。
1)?Procfile
#代碼的執(zhí)行語句web:?sh?setup.sh?&&?streamlit?run?Streamlit_Demo.py2)?requirements.txt
#?代碼所需的庫及其版本streamlit==0.56.0pandas==0.25.1numpy==1.16.53)?setup.sh
#?配置mkdir?-p?~/.streamlit/echo?"\[server]\n\headless?=?true\n\port?=?$PORT\n\enableCORS?=?false\n\\n\"?>?~/.streamlit/config.toml最后,配置文件和代碼準(zhǔn)備好后,可以保存在本機(jī)demo路徑下。再按照以下步驟進(jìn)行部署:
1)?進(jìn)入項(xiàng)目路徑,先登錄heroku,輸入“heroku login”后按下空格鍵,默認(rèn)瀏覽器會(huì)自動(dòng)打開,輸入heroku賬號(hào)和密碼后關(guān)閉即可。
cd?demoheroku?login2)?創(chuàng)建一個(gè)新應(yīng)用,輸入”heroku create xx”,heroku規(guī)定應(yīng)用名稱開頭結(jié)尾只能是小寫字母,并且全名只能包含小寫字母,數(shù)字和破折號(hào)。也可以只輸入”heroku create”,會(huì)自動(dòng)命名一個(gè)應(yīng)用。
heroku?create?streamlit-demo-01#?或者#?heroku?create3)?初始化git代碼庫,并遠(yuǎn)程操控heroku。
4)?上傳代碼到heroku代碼庫。
5)?執(zhí)行”heroku open”打開部署好的應(yīng)用,若打開后出現(xiàn)”?Application error”,需要自行排查是否缺失文件或文件內(nèi)容有誤,筆者一開始因?yàn)槿鄙佟眘etup.sh”文件導(dǎo)致部署失敗。另外,筆者直接從github clone后也會(huì)報(bào)錯(cuò),所以是在本機(jī)新建文件和文件夾的,項(xiàng)目有上傳至“
https://github.com/guoxulong/streamlit_demo
heroku?open6)?部署完成后,輸入“https://streamlit-demo-01.herokuapp.com/”(需翻墻)就能夠訪問這個(gè)Web。?
圖7 部署完成界面
總結(jié)
總體上來講,相比較用Django框架開發(fā)Web,Streamlit開發(fā)一個(gè)交互式應(yīng)用會(huì)更輕松,雖然功能還不完善,但對于數(shù)據(jù)分析可視化來說已經(jīng)滿足了,而且只需要掌握Streamlit庫的用法就可以實(shí)現(xiàn)。
作者簡介:
AJ Gordon,對爬蟲/機(jī)器學(xué)習(xí)/數(shù)據(jù)建模/可視化均有所涉獵的數(shù)據(jù)分析師
【END】
推薦閱讀
一文帶你從頭認(rèn)識(shí)什么是「緩存」!
在 520 這天,竟然有人把 Docker講清楚了? | 原力計(jì)劃
如何使用 SQL Server FILESTREAM 存儲(chǔ)非結(jié)構(gòu)化數(shù)據(jù)?這篇文章告訴你!
平安科技王健宗:所有 AI 前沿技術(shù),都可以在聯(lián)邦學(xué)習(xí)中大展身手!
踢翻這碗狗糧:程序員花 7 個(gè)月敲出 eBay,只因女票喜歡糖果盒!
又一年5.20,用Python助力程序員脫單大攻略(視頻版)
斗地主嗎?能學(xué)區(qū)塊鏈那種! | 原力計(jì)劃
真香,朕在看了!
總結(jié)
以上是生活随笔為你收集整理的实操来了!一文告诉你如何用 Streamlit 和 Heroku 开发 Web的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 别吹了!Python程序员正在消失! 资
- 下一篇: 阿里达摩院又火了!引入AI确诊肺炎提速1