全文共6260字，預(yù)計(jì)學(xué)習(xí)時(shí)長13分鐘

不了解任何網(wǎng)頁框架？沒關(guān)系，本文將教你如何輕松搞定從數(shù)據(jù)科學(xué)項(xiàng)目到超棒程序的無縫轉(zhuǎn)換。

圖片來源：Cody Black Unsplash

稍作休息，開始編碼。

機(jī)器學(xué)習(xí)項(xiàng)目只有充分展示給公眾時(shí)才稱得上是完整的項(xiàng)目。

過去在介紹數(shù)據(jù)科學(xué)項(xiàng)目時(shí)，選擇合適的可視化操作或簡單的PPT就足夠了，但現(xiàn)在隨著像RShiny和Dash這類儀表盤化工具的出現(xiàn)，一名合格的數(shù)據(jù)科學(xué)家也需要掌握一定的Web框架的知識(shí)。

可Web框架也不是塊好啃的骨頭。筆者在嘗試一些看似簡單的操作時(shí)，仍會(huì)被HTML、CSS和Javascript等搞得暈頭轉(zhuǎn)向，于數(shù)次實(shí)踐中嘗遍失敗的滋味。

對(duì)數(shù)據(jù)科學(xué)同胞們來說，Web開發(fā)只是次要技能，所以更別提嘗試多種途徑做這一件事了，會(huì)讓這些人不知所措的。

那我們就注定避免不了Web框架的學(xué)習(xí)之路嗎？還是說大半夜的給開發(fā)人員打電話問一些很蠢的問題？

于是StreamLit帶著自身的使命出現(xiàn)了，它僅借助Python就能夠創(chuàng)建Web應(yīng)用程序。

Python的宗旨：簡單勝于復(fù)雜，而Streamlit創(chuàng)建應(yīng)用程序則完美地詮釋了其易操作性。

這篇文將為大家講解何使用Streamlit來創(chuàng)建支持?jǐn)?shù)據(jù)科學(xué)項(xiàng)目的應(yīng)用程序。

安裝

安裝步驟跟運(yùn)行指令一樣簡單：

pip install streamlit

查看是否安裝成功時(shí)只需運(yùn)行：

streamlit hello

屏幕上應(yīng)該顯示的是：

可以在瀏覽器中訪問本地URL：localhost:8501，來查看執(zhí)行中的Streamlit應(yīng)用程序。開發(fā)人員那里也有許多很棒的樣本可供嘗試。

Streamlit“你好，世界”

Streamlit旨在通過簡單的Python代碼實(shí)現(xiàn)簡單的程序開發(fā)。

那就設(shè)計(jì)一款簡單的應(yīng)用程序，看看它是否真的像它說的那樣。

從Streamlit的名為“hello，world”的程序入手，這個(gè)程序并不復(fù)雜。只需要復(fù)制粘貼下面這個(gè)代碼到“helloworld.py”的文件夾中即可。

import streamlit as st

x = st.slider('x')

st.write(x, 'squared is', x * x)

然后到最后運(yùn)行階段時(shí)：

streamlit run helloworld.py

看吧，瀏覽器連接到localhost:8501，就可以看到執(zhí)行中的程序，滑動(dòng)鼠標(biāo)就可以得到結(jié)果。

簡單的滑塊插件應(yīng)用程序

操作非常簡單。在構(gòu)建上圖應(yīng)用程序時(shí)，用到了Streamlit的兩個(gè)特性：

? st.slider插件——滑動(dòng)改變Web應(yīng)用程序的輸出內(nèi)容。

? 以及通用的st.write 指令。筆者對(duì)于它能從圖標(biāo)、數(shù)據(jù)框和簡單的文本中編寫任何東西感到驚訝。后面會(huì)有詳細(xì)介紹。

敲黑板：大家要記住每次改變插件值時(shí)，整個(gè)應(yīng)用程序都會(huì)由上至下運(yùn)行。

Streamlit插件

插件提供了控制應(yīng)用程序的方法，閱讀了解插件的最佳選擇就是API參考文檔，不過筆者這里也會(huì)講解一些插件，它們都是用戶在操作后期會(huì)用的最主要的插件。

1. 滑塊

streamlit.slider(label, min_value=None, max_value=None, value=None, step=None, format=None)

在上文已經(jīng)目睹了st.slider的執(zhí)行過程，它可以結(jié)合min_value、max_value使用，用于進(jìn)一步得到一定范圍內(nèi)的輸入內(nèi)容。

2. 文本輸入

獲取用戶輸入最簡單的方式是輸入U(xiǎn)RL或一些用于分析情緒的文本內(nèi)容，需要的只是一個(gè)用來命名文本框的標(biāo)簽。

import streamlit as st

url = st.text_input('Enter URL')

st.write('The Entered URL is', url)

看到的程序?qū)⑹沁@樣：

簡單的text_input widget程序

貼士：可以只改變helloworld.py文件然后刷新頁面。筆者的做法是打開該文件然后在文本編輯器中改動(dòng)，再一點(diǎn)一點(diǎn)查看變動(dòng)的地方。

3. 復(fù)選框

復(fù)選框的一個(gè)功能就是隱藏或顯示/隱藏程序中的特定區(qū)域，另一個(gè)用途是設(shè)置函數(shù)的布爾參數(shù)值。st.checkbox() 需要一個(gè)參數(shù)，即插件標(biāo)簽。在該應(yīng)用程序中，復(fù)選框會(huì)用來切換條件語句。

import streamlit as st

import pandas as pd

import numpy as np

df = pd.read_csv("football_data.csv")

if st.checkbox('Show dataframe'):

st.write(df)

簡單的復(fù)選框插件應(yīng)用程序

4. 下拉框插件

通過st.selectbox可以在一系列選項(xiàng)或列表中進(jìn)行選擇。常見的用法是將其作為下拉項(xiàng)然后從名單中挑選值。

import streamlit as st

import pandas as pd

import numpy as np

df = pd.read_csv("football_data.csv")option = st.selectbox(

'Which Club do you like best?',

df['Club'].unique())

'You selected: ', option

簡單的下拉框/復(fù)選框插件程序

5. 多選插件

也可以用下拉框內(nèi)的多個(gè)值。這里講的是使用 st.multiselect在變量選選中獲取多個(gè)值作為列表。

import streamlit as st

import pandas as pd

import numpy as np

df = pd.read_csv("football_data.csv")

options = st.multiselect(

'What are your favorite clubs?', df['Club'].unique())

st.write('You selected:', options)

簡單的下拉框插件應(yīng)用程序

一步步創(chuàng)建應(yīng)用程序

重要插件了解的也差不多了，現(xiàn)在馬上要用多個(gè)插件創(chuàng)建應(yīng)用程序。

從簡單的步驟入門，嘗試使用Streamlit對(duì)足球數(shù)據(jù)進(jìn)行可視化。有了上面那些插件，這個(gè)步驟執(zhí)行起來會(huì)容易很多。

import streamlit as st

import pandas as pd

import numpy as np

df = pd.read_csv("football_data.csv")

clubs = st.multiselect('Show Player for clubs?', df['Club'].unique())

nationalities = st.multiselect('Show Player from Nationalities?', df['Nationality'].unique())

# Filter dataframe

new_df = df[(df['Club'].isin(clubs)) & (df['Nationality'].isin(nationalities))]

# write dataframe to screen

st.write(new_df)

簡單的應(yīng)用程序會(huì)是這樣的：

同時(shí)使用多個(gè)插件

這一點(diǎn)也不難，但目前看起來似乎太基礎(chǔ)了。是否可以考慮加入一些圖表呢？

Streamlit當(dāng)前支持許多用于繪圖的庫，其中就有Plotly, Bokeh, Matplotlib, Altair和Vega圖表。Plotly Express也可以，只不過沒有詳細(xì)說明。也存在一些內(nèi)嵌式圖表，相當(dāng)于Streamlit“自帶”的，比如st.line_chart 和st.area_chart.

此時(shí)會(huì)用到plotly_express，下面是設(shè)計(jì)程序會(huì)用到的代碼。該過程只會(huì)調(diào)用Streamlit四次。剩下的都是一些簡單的Python代碼操作。

import streamlit as st

import pandas as pd

import numpy as np

import plotly_express as px

df = pd.read_csv("football_data.csv")

clubs = st.multiselect('Show Player for clubs?', df['Club'].unique())

nationalities = st.multiselect('Show Player from Nationalities?', df['Nationality'].unique())new_df = df[(df['Club'].isin(clubs)) & (df['Nationality'].isin(nationalities))]

st.write(new_df)

# create figure using plotly express

fig = px.scatter(new_df, x ='Overall',y='Age',color='Name')

# Plot!

st.plotly_chart(fig)

添加圖表

改進(jìn)

在本文一開始有提到插件每次發(fā)生變動(dòng)時(shí)，整個(gè)應(yīng)用程序就會(huì)由上至下地運(yùn)行。其實(shí)并不可行，因?yàn)閯?chuàng)建的應(yīng)用程序會(huì)保留下深度學(xué)習(xí)模型或復(fù)雜的機(jī)器學(xué)習(xí)模型。接下來在講Streamlit的緩存時(shí)會(huì)向讀者闡釋這一點(diǎn)。

1. 緩存

在這個(gè)簡單的程序里，但凡值有所變動(dòng)時(shí)，數(shù)據(jù)科學(xué)家們就會(huì)反復(fù)瀏覽數(shù)據(jù)框。它比較適用于用戶手中的小規(guī)模數(shù)據(jù)，至于大規(guī)?；蛐枰M(jìn)行很多步處理的數(shù)據(jù)，它是不予理睬的。接下來在Streamlit中通過st.cache裝飾器函數(shù)體驗(yàn)緩存的功能吧。

import streamlit as st

import pandas as pd

import numpy as np

import plotly_express as px

df = st.cache(pd.read_csv)("football_data.csv")

或者是復(fù)雜一些、時(shí)間耗費(fèi)久一些的函數(shù)，只需要運(yùn)行一次，此時(shí)可以用：

@st.cache

def complex_func(a,b):

DO SOMETHING COMPLEX

# Won't run again and again.

complex_func(a,b)

用Streamlit的緩存裝飾器標(biāo)記函數(shù)時(shí)，無論這個(gè)函數(shù)是否執(zhí)行，都會(huì)檢查輸入的參數(shù)值（由該函數(shù)處理的）。

如果Streamlit之前沒有處理過這些數(shù)據(jù)，它會(huì)調(diào)用函數(shù)并將運(yùn)算結(jié)果存到本地緩存中。

下次再調(diào)用函數(shù)時(shí)，倘若還是這些參數(shù)，Streamlit就會(huì)完全跳過這一塊的函數(shù)執(zhí)行，直接用緩存器里的結(jié)果數(shù)據(jù)。

2. 側(cè)邊欄

為了根據(jù)個(gè)人的傾向需求使界面更加簡潔，用戶可能會(huì)想著把插件移動(dòng)到側(cè)邊欄內(nèi)，比如像Rshiny儀表盤。這非常簡單，只需在插件代碼中添加 st.sidebar即可。

import streamlit as st

import pandas as pd

import numpy as np

import plotly_express as px

df = st.cache(pd.read_csv)("football_data.csv")

clubs = st.sidebar.multiselect('Show Player for clubs?', df['Club'].unique())

nationalities = st.sidebar.multiselect('Show Player from Nationalities?', df['Nationality'].unique())

new_df = df[(df['Club'].isin(clubs)) & (df['Nationality'].isin(nationalities))]

st.write(new_df)

# Create distplot with custom bin_size

fig = px.scatter(new_df, x ='Overall',y='Age',color='Name')

# Plot!

st.plotly_chart(fig)

將插件移動(dòng)到側(cè)邊欄內(nèi)

3. Markdown標(biāo)記語言可以嗎？

筆者特別喜歡在Markdown里編輯文字，因?yàn)榘l(fā)現(xiàn)相比HTML，它少了那些繁瑣的操作，而且更能勝任數(shù)據(jù)科學(xué)的任務(wù)。所以讀者也能在Streamlit程序中應(yīng)用Markdown嗎？

答案是可以。而且是有跡可循的。在筆者看來，最合適的就是調(diào)用Magic指令。通過該指令，用戶做標(biāo)記語言就會(huì)像寫評(píng)論一樣簡單。用戶也可以使用指令st.markdown。

import streamlit as st

import pandas as pd

import numpy as np

import plotly_express as px'''

# Club and Nationality App

This very simple webapp allows you to select and visualize players from certain clubs and certain nationalities.

'''

df = st.cache(pd.read_csv)("football_data.csv")

clubs = st.sidebar.multiselect('Show Player for clubs?', df['Club'].unique())

nationalities = st.sidebar.multiselect('Show Player from Nationalities?', df['Nationality'].unique())new_df = df[(df['Club'].isin(clubs)) & (df['Nationality'].isin(nationalities))]

st.write(new_df)

# Create distplot with custom bin_size

fig = px.scatter(new_df, x ='Overall',y='Age',color='Name')

'''

### Here is a simple chart between player age and overall

'''

st.plotly_chart(fig)

最終的樣品

總結(jié)

Streamlit已經(jīng)介紹了整個(gè)創(chuàng)建應(yīng)用程序的步驟，筆者真沒什么可補(bǔ)充的了。

這篇文章中講述了一個(gè)簡單網(wǎng)頁程序的創(chuàng)建，但有太多未知數(shù)了。舉個(gè)例子，在Streamlit網(wǎng)站碰到GAN時(shí)，只會(huì)選擇插件和緩存的指導(dǎo)思想。

筆者對(duì)程序的默認(rèn)顏色和風(fēng)格很喜愛，而且發(fā)現(xiàn)這用起來比Dash還順手，筆者創(chuàng)建新程序之前一直用的是Dash。讀者們也可以在自己的Streamlit程序中加上音頻和視頻項(xiàng)。

最重要的是，Streamlit是一款免費(fèi)的開源軟件，而不是開箱即用的私人網(wǎng)絡(luò)應(yīng)用。

以前筆者遇到任何變動(dòng)或問題，都需要請(qǐng)教身邊的程序猿朋友；而現(xiàn)在，完全不會(huì)這么麻煩了。

筆者的目標(biāo)是從現(xiàn)在開始，在工作流中多用這個(gè)程序。即便是不難的任務(wù)，也會(huì)考慮用它，筆者覺得你也可以。

雖然筆者還未曾想過在生產(chǎn)環(huán)境下它執(zhí)行的好壞，但對(duì)于概念項(xiàng)目和演示的小型驗(yàn)證來說，它算得上是福音了。筆者的目標(biāo)是從現(xiàn)在開始，在工作流中多用這個(gè)程序。即便是不難的任務(wù)，也會(huì)考慮用它，筆者覺得你也可以。

完整代碼：https://github.com/MLWhiz/streamlit_football_demo

留言 點(diǎn)贊 關(guān)注

我們一起分享AI學(xué)習(xí)與發(fā)展的干貨

如需轉(zhuǎn)載，請(qǐng)后臺(tái)留言，遵守轉(zhuǎn)載規(guī)范