全文共6260字，預計學習時長13分鐘

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

圖片來源：Cody Black Unsplash

稍作休息，開始編碼。

機器學習項目只有充分展示給公眾時才稱得上是完整的項目。

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

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

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

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

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

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

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

安裝

安裝步驟跟運行指令一樣簡單：

pip install streamlit

查看是否安裝成功時只需運行：

streamlit hello

屏幕上應該顯示的是：

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

Streamlit“你好，世界”

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

那就設計一款簡單的應用程序，看看它是否真的像它說的那樣。

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

import streamlit as st

x = st.slider('x')

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

然后到最后運行階段時：

streamlit run helloworld.py

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

簡單的滑塊插件應用程序

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

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

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

敲黑板：大家要記住每次改變插件值時，整個應用程序都會由上至下運行。

Streamlit插件

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

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使用，用于進一步得到一定范圍內(nèi)的輸入內(nèi)容。

2. 文本輸入

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

import streamlit as st

url = st.text_input('Enter URL')

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

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

簡單的text_input widget程序

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

3. 復選框

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

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)

簡單的復選框插件應用程序

4. 下拉框插件

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

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

簡單的下拉框/復選框插件程序

5. 多選插件

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

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)

簡單的下拉框插件應用程序

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

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

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

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)

簡單的應用程序會是這樣的：

同時使用多個插件

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

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

此時會用到plotly_express，下面是設計程序會用到的代碼。該過程只會調(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)

添加圖表

改進

在本文一開始有提到插件每次發(fā)生變動時，整個應用程序就會由上至下地運行。其實并不可行，因為創(chuàng)建的應用程序會保留下深度學習模型或復雜的機器學習模型。接下來在講Streamlit的緩存時會向讀者闡釋這一點。

1. 緩存

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

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")

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

@st.cache

def complex_func(a,b):

DO SOMETHING COMPLEX

# Won't run again and again.

complex_func(a,b)

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

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

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

2. 側(cè)邊欄

為了根據(jù)個人的傾向需求使界面更加簡潔，用戶可能會想著把插件移動到側(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)

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

3. Markdown標記語言可以嗎？

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

答案是可以。而且是有跡可循的。在筆者看來，最合適的就是調(diào)用Magic指令。通過該指令，用戶做標記語言就會像寫評論一樣簡單。用戶也可以使用指令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)介紹了整個創(chuàng)建應用程序的步驟，筆者真沒什么可補充的了。

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

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

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

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

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

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

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

留言 點贊 關(guān)注

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

如需轉(zhuǎn)載，請后臺留言，遵守轉(zhuǎn)載規(guī)范