入門指南:使用Streamlit創(chuàng)建交互式數(shù)據(jù)應(yīng)用程序
? ? ? ?Streamlit是一個(gè)強(qiáng)大的Python庫(kù),它使得創(chuàng)建交互式的數(shù)據(jù)應(yīng)用程序和數(shù)據(jù)可視化變得輕而易舉。無(wú)論你是數(shù)據(jù)分析師、機(jī)器學(xué)習(xí)工程師,還是想要為數(shù)據(jù)添加一個(gè)動(dòng)態(tài)的外觀,Streamlit都是一個(gè)強(qiáng)大的工具。本文將帶你逐步了解Streamlit的安裝和主要功能,幫助你入門這個(gè)令人興奮的庫(kù)。
一、安裝Streamlit
在開始之前,請(qǐng)確保你已經(jīng)安裝了Python。然后,你可以按照以下步驟來(lái)安裝Streamlit:
打開終端(命令行界面)。
輸入以下命令并按下回車鍵:
安裝完成后,你就可以開始使用Streamlit了。
二、Streamlit功能
1、數(shù)據(jù)可視化
? ? ? ?當(dāng)使用Streamlit進(jìn)行數(shù)據(jù)可視化時(shí),你可以將數(shù)據(jù)轉(zhuǎn)化為各種類型的圖表和圖像,以更好地理解和傳達(dá)信息。Streamlit提供了多個(gè)函數(shù)和工具,使得創(chuàng)建折線圖、柱狀圖、散點(diǎn)圖、地圖等各種類型的圖表變得非常簡(jiǎn)單。以下是一些常見的數(shù)據(jù)可視化示例,以及如何使用Streamlit來(lái)創(chuàng)建它們:
1)、折線圖
? ? ? ?折線圖是顯示數(shù)據(jù)隨時(shí)間或其他連續(xù)變量的變化趨勢(shì)的有效方式。在Streamlit中,你可以使用st.line_chart()
函數(shù)來(lái)創(chuàng)建折線圖。以下是一個(gè)創(chuàng)建折線圖的示例:
? ? ? ?在這個(gè)示例中,我們首先導(dǎo)入了streamlit
和pandas
庫(kù)。然后,我們創(chuàng)建了一個(gè)示例的數(shù)據(jù)字典,并用pd.DataFrame
創(chuàng)建了一個(gè)Pandas DataFrame對(duì)象。最后,我們使用st.title()
設(shè)置標(biāo)題,并使用st.line_chart()
展示銷售趨勢(shì)的折線圖。
2)、柱狀圖
? ? ? ?柱狀圖用于比較不同類別的數(shù)據(jù)之間的差異。在Streamlit中,你可以使用st.bar_chart()
函數(shù)來(lái)創(chuàng)建柱狀圖。以下是一個(gè)創(chuàng)建柱狀圖的示例:
? ? ? ?在這個(gè)示例中,我們使用st.title()
設(shè)置標(biāo)題,并使用st.bar_chart()
展示產(chǎn)品銷售的柱狀圖。注意,我們使用了set_index()
來(lái)將"Product"列設(shè)置為索引,以便在柱狀圖中以產(chǎn)品名稱為標(biāo)簽。
3)、散點(diǎn)圖
? ? ? ?散點(diǎn)圖用于顯示兩個(gè)變量之間的關(guān)系,每個(gè)點(diǎn)代表一個(gè)數(shù)據(jù)點(diǎn)。在Streamlit中,你可以使用st.scatter_chart()
函數(shù)來(lái)創(chuàng)建散點(diǎn)圖。以下是一個(gè)創(chuàng)建散點(diǎn)圖的示例:
? ? ? ?在這個(gè)示例中,我們使用st.title()
設(shè)置標(biāo)題,并使用st.scatter_chart()
展示身高與體重之間的關(guān)系的散點(diǎn)圖。通過(guò)指定x
和y
參數(shù),我們可以設(shè)置散點(diǎn)圖的橫軸和縱軸變量。
4)、地圖可視化
? ? ? ?地圖可視化用于展示地理分布和位置數(shù)據(jù)。在Streamlit中,你可以使用st.map()
函數(shù)來(lái)在地圖上顯示數(shù)據(jù)點(diǎn)。以下是一個(gè)展示城市銷售地點(diǎn)的地圖可視化的示例:
? ? ? ?在這個(gè)示例中,我們使用st.title()
設(shè)置標(biāo)題,并使用st.map()
展示城市銷售地點(diǎn)的地圖。數(shù)據(jù)中的緯度和經(jīng)度信息將被用來(lái)定位數(shù)據(jù)點(diǎn)在地圖上的位置。
? ? ? ?通過(guò)這些示例,你可以看到Streamlit是如何提供簡(jiǎn)單的方法來(lái)創(chuàng)建各種類型的數(shù)據(jù)可視化,從而幫助你更好地理解和傳達(dá)數(shù)據(jù)的信息。你可以根據(jù)實(shí)際需求,使用不同的圖表類型和數(shù)據(jù),創(chuàng)造出各種各樣的數(shù)據(jù)可視化效果。
2、交互式小部件
? ? ? ?交互式小部件是Streamlit的一個(gè)強(qiáng)大功能,它允許你在應(yīng)用程序中添加交互式元素,使用戶能夠在應(yīng)用程序中進(jìn)行選擇、輸入和操作。這些小部件使你的應(yīng)用程序更加動(dòng)態(tài)和可定制。以下是一些常見的交互式小部件,以及如何在Streamlit中使用它們:
1)、文本輸入框
? ? ? ?文本輸入框允許用戶輸入文本信息。你可以使用st.text_input()
函數(shù)創(chuàng)建文本輸入框。
? ? ? ?在這個(gè)示例中,用戶可以在文本輸入框中輸入他們的姓名。st.text_input()
函數(shù)接受一個(gè)標(biāo)簽(用于顯示在輸入框旁邊),并返回用戶輸入的文本。
?2)、數(shù)字輸入框
? ? ? ?數(shù)字輸入框允許用戶輸入數(shù)字。你可以使用st.number_input()
函數(shù)創(chuàng)建數(shù)字輸入框。
? ? ? ?在這個(gè)示例中,用戶可以在數(shù)字輸入框中輸入他們的年齡。st.number_input()
函數(shù)接受一個(gè)標(biāo)簽、最小值和最大值,返回用戶輸入的數(shù)字。
3)、下拉菜單
? ? ? ?下拉菜單允許用戶從預(yù)定義選項(xiàng)中進(jìn)行選擇。你可以使用st.selectbox()
函數(shù)創(chuàng)建下拉菜單。
? ? ? ?在這個(gè)示例中,用戶可以從給定的選項(xiàng)中選擇性別。st.selectbox()
函數(shù)接受一個(gè)標(biāo)簽和選項(xiàng)列表,返回用戶選擇的項(xiàng)。
4)、多選框
? ? ? ?多選框允許用戶從多個(gè)選項(xiàng)中進(jìn)行多項(xiàng)選擇。你可以使用st.multiselect()
函數(shù)創(chuàng)建多選框。
? ? ? ?在這個(gè)示例中,用戶可以從多個(gè)選項(xiàng)中選擇他們的興趣。st.multiselect()
函數(shù)接受一個(gè)標(biāo)簽和選項(xiàng)列表,返回用戶選擇的項(xiàng)。
5)、滑動(dòng)條
? ? ? ?滑動(dòng)條允許用戶在一個(gè)范圍內(nèi)選擇一個(gè)值。你可以使用st.slider()
函數(shù)創(chuàng)建滑動(dòng)條。
? ? ? ?在這個(gè)示例中,用戶可以在0到10的范圍內(nèi)選擇一個(gè)評(píng)分值。st.slider()
函數(shù)接受一個(gè)標(biāo)簽、最小值、最大值和初始值,返回用戶選擇的值。
? ? ? ?通過(guò)這些示例,你可以看到Streamlit的交互式小部件是如何讓你與用戶進(jìn)行實(shí)時(shí)的交互和反饋的。你可以根據(jù)實(shí)際需求,選擇合適的小部件類型,為你的應(yīng)用程序添加更多交互性和用戶友好性。
3、數(shù)據(jù)表格展示
? ? ? ?數(shù)據(jù)表格展示是Streamlit中的一個(gè)重要功能,它允許你以表格形式呈現(xiàn)數(shù)據(jù),讓用戶能夠查看和分析數(shù)據(jù)。你可以使用st.table()
函數(shù)將Pandas DataFrame或其他表格數(shù)據(jù)顯示在應(yīng)用程序中。以下是關(guān)于如何在Streamlit中展示數(shù)據(jù)表格的詳細(xì)講解:
1)、展示Pandas.DataFrame
? ? ? ?你可以使用st.table()
函數(shù)來(lái)展示一個(gè)Pandas.DataFrame。以下是一個(gè)示例:
? ? ? ?在這個(gè)示例中,我們首先導(dǎo)入了streamlit
和pandas
庫(kù)。然后,我們創(chuàng)建了一個(gè)示例的數(shù)據(jù)字典,并用pd.DataFrame
創(chuàng)建了一個(gè)Pandas DataFrame對(duì)象。最后,我們使用st.title()
設(shè)置標(biāo)題,使用st.write()
添加說(shuō)明文字,以及使用st.table()
展示數(shù)據(jù)表格。
2)、自定義數(shù)據(jù)格式
? ? ? ?Streamlit允許你自定義展示表格的樣式,以適應(yīng)你的應(yīng)用程序外觀。你可以使用st.table()
的use_container_width
參數(shù),將表格的寬度設(shè)置為容器的寬度,以確保表格適應(yīng)應(yīng)用程序的布局。
? ? ? ?在這個(gè)示例中,我們通過(guò)將use_container_width
參數(shù)設(shè)置為True
,將表格的寬度設(shè)置為容器的寬度。這樣可以確保表格不會(huì)過(guò)寬,與應(yīng)用程序的布局保持一致。
3)、數(shù)據(jù)表格的交互
? ? ? ?盡管st.table()
默認(rèn)是靜態(tài)的,但你可以通過(guò)一些技巧增加數(shù)據(jù)表格的交互性。例如,你可以使用st.dataframe()
函數(shù)將Pandas DataFrame轉(zhuǎn)化為一個(gè)可滾動(dòng)的數(shù)據(jù)表格,允許用戶瀏覽大量數(shù)據(jù)。
? ? ? ?在這個(gè)示例中,我們使用st.dataframe()
函數(shù)將Pandas DataFrame轉(zhuǎn)化為一個(gè)可滾動(dòng)的數(shù)據(jù)表格,使用戶能夠?yàn)g覽較大的數(shù)據(jù)集。
? ? ? ?通過(guò)這些示例,你可以看到如何在Streamlit中展示數(shù)據(jù)表格,并根據(jù)需要自定義樣式和交互性。展示數(shù)據(jù)表格可以幫助你向用戶傳達(dá)數(shù)據(jù),使他們能夠更好地理解和分析數(shù)據(jù)。
4、文本和說(shuō)明
? ? ? 在Streamlit中,你可以使用文本和說(shuō)明來(lái)為你的應(yīng)用程序添加標(biāo)題、段落、注釋和其他文字內(nèi)容,以幫助用戶更好地理解數(shù)據(jù)和應(yīng)用程序的功能。以下是關(guān)于如何使用文本和說(shuō)明的詳細(xì)講解:
1)、添加標(biāo)題
? ? ? ?你可以使用st.title()
函數(shù)來(lái)設(shè)置應(yīng)用程序的標(biāo)題。
? ? ? ?在這個(gè)示例中,我們使用st.title()
設(shè)置了一個(gè)標(biāo)題,用于歡迎用戶使用應(yīng)用程序。
2)、添加段落文字
? ? ? ?你可以使用st.write()
函數(shù)來(lái)添加段落和說(shuō)明文字。
? ? ? ?在這個(gè)示例中,我們使用st.write()
函數(shù)添加了一些段落和說(shuō)明文字,以向用戶解釋應(yīng)用程序的用途和功能。
3)、使用markdown語(yǔ)法
? ? ? ?除了普通的文本,你還可以使用Markdown語(yǔ)法來(lái)添加更豐富的文本樣式,如標(biāo)題、鏈接、列表等。
? ? ? ?在這個(gè)示例中,我們使用st.markdown()
函數(shù)來(lái)添加使用Markdown語(yǔ)法的文本。通過(guò)Markdown語(yǔ)法,你可以創(chuàng)建更具有格式的文本內(nèi)容。
4)、使用HTML標(biāo)簽
? ? ? 如果你需要更高級(jí)的文本格式控制,你還可以使用HTML標(biāo)簽來(lái)添加文本內(nèi)容。
? ? ? ?在這個(gè)示例中,我們使用unsafe_allow_html=True
參數(shù)來(lái)允許使用HTML標(biāo)簽。這樣,你可以自定義文本的樣式和格式。
5)、說(shuō)明文字的排版
? ? ? ?通過(guò)結(jié)合使用不同的文本和說(shuō)明函數(shù),你可以創(chuàng)建豐富多樣的文本內(nèi)容,以滿足不同的展示需求。你可以在不同的地方添加標(biāo)題、段落、鏈接等,以便向用戶提供更多信息。
? ? ? ?通過(guò)這些方法,你可以在Streamlit應(yīng)用程序中添加各種類型的文本和說(shuō)明,以幫助用戶更好地理解你的數(shù)據(jù)和應(yīng)用程序的功能。
5、交互式過(guò)濾和篩選
? ? ? ?在Streamlit中,你可以使用交互式小部件來(lái)實(shí)現(xiàn)數(shù)據(jù)的過(guò)濾和篩選,以便用戶可以根據(jù)自己的需求選擇不同條件下的數(shù)據(jù)。這樣的功能使用戶能夠在不同視角下查看數(shù)據(jù),更好地分析和理解數(shù)據(jù)集。以下是關(guān)于如何實(shí)現(xiàn)交互式過(guò)濾和篩選的詳細(xì)講解:
1)、使用下拉菜單
? ? ? ?使用下拉菜單(st.selectbox()
函數(shù))是一種常見的方式來(lái)實(shí)現(xiàn)交互式篩選。下面是一個(gè)示例,展示如何根據(jù)用戶選擇來(lái)篩選產(chǎn)品銷售數(shù)據(jù):
? ? ? ?在這個(gè)示例中,用戶可以從下拉菜單中選擇一個(gè)產(chǎn)品名稱,然后根據(jù)選擇來(lái)展示相應(yīng)的銷售數(shù)據(jù)。通過(guò)使用st.selectbox()
函數(shù)和條件篩選,你可以在應(yīng)用程序中實(shí)現(xiàn)交互式的過(guò)濾功能。
2)、使用滑動(dòng)條和多選框
? ? ? ?除了下拉菜單,你還可以使用滑動(dòng)條(st.slider()
函數(shù))和多選框(st.multiselect()
函數(shù))來(lái)實(shí)現(xiàn)不同類型的過(guò)濾。以下是一個(gè)示例,展示如何使用滑動(dòng)條和多選框來(lái)過(guò)濾用戶年齡數(shù)據(jù):
? ? ? ?在這個(gè)示例中,用戶可以使用滑動(dòng)條設(shè)置最小和最大年齡,以及使用多選框選擇特定年齡。根據(jù)用戶選擇的過(guò)濾條件,應(yīng)用程序?qū)⒄故鞠鄳?yīng)的數(shù)據(jù)。通過(guò)結(jié)合不同的交互式小部件,你可以創(chuàng)建更復(fù)雜的過(guò)濾和篩選功能。
? ? ? ?交互式過(guò)濾和篩選可以使用戶在應(yīng)用程序中自由選擇不同條件下的數(shù)據(jù),從而更好地理解數(shù)據(jù)集的特點(diǎn)。你可以根據(jù)你的數(shù)據(jù)和應(yīng)用場(chǎng)景,使用不同的交互式小部件來(lái)創(chuàng)建個(gè)性化的過(guò)濾體驗(yàn)。通過(guò)這些方法,你可以為用戶提供一種更加交互式和靈活的數(shù)據(jù)瀏覽方式。
6、實(shí)時(shí)數(shù)據(jù)更新
? ? ? ?在Streamlit中,你可以實(shí)現(xiàn)實(shí)時(shí)數(shù)據(jù)更新,即當(dāng)用戶與應(yīng)用程序進(jìn)行交互時(shí),數(shù)據(jù)和可視化結(jié)果可以實(shí)時(shí)地進(jìn)行更新,以呈現(xiàn)最新的信息。這樣的功能可以使用戶在交互中獲得實(shí)時(shí)反饋,更好地理解數(shù)據(jù)的變化。以下是關(guān)于如何實(shí)現(xiàn)實(shí)時(shí)數(shù)據(jù)更新的詳細(xì)講解:
1)、利用小部件的狀態(tài)
? ? ? ?Streamlit中的小部件是狀態(tài)感知的,這意味著它們可以在應(yīng)用程序運(yùn)行過(guò)程中保持狀態(tài)。你可以利用小部件的狀態(tài)來(lái)實(shí)現(xiàn)數(shù)據(jù)的實(shí)時(shí)更新。以下是一個(gè)示例,展示如何創(chuàng)建一個(gè)實(shí)時(shí)更新的計(jì)數(shù)器:
? ? ? ?在這個(gè)示例中,我們使用st.number_input()
創(chuàng)建一個(gè)輸入框,用戶可以輸入計(jì)數(shù)器的初始值。然后,我們使用st.button()
創(chuàng)建一個(gè)按鈕,當(dāng)用戶點(diǎn)擊按鈕時(shí),計(jì)數(shù)器的值將增加,并且實(shí)時(shí)顯示在頁(yè)面上。
2)、使用小部件回調(diào)函數(shù)
? ? ? ?為了實(shí)現(xiàn)更復(fù)雜的實(shí)時(shí)數(shù)據(jù)更新,你可以使用小部件回調(diào)函數(shù)。小部件回調(diào)函數(shù)會(huì)在小部件的值發(fā)生變化時(shí)被調(diào)用,你可以在回調(diào)函數(shù)中更新相關(guān)的數(shù)據(jù)和可視化結(jié)果。以下是一個(gè)示例,展示如何創(chuàng)建一個(gè)實(shí)時(shí)數(shù)據(jù)可視化,當(dāng)用戶調(diào)整滑動(dòng)條時(shí),圖表會(huì)實(shí)時(shí)更新:
? ? ? ?在這個(gè)示例中,我們使用st.slider()
創(chuàng)建一個(gè)滑動(dòng)條,允許用戶選擇頻率。然后,我們?cè)谛〔考卣{(diào)函數(shù)中實(shí)時(shí)更新圖表,根據(jù)用戶選擇的頻率來(lái)顯示不同的正弦曲線。
? ? ? ?實(shí)時(shí)數(shù)據(jù)更新可以讓用戶在與應(yīng)用程序交互時(shí)獲得即時(shí)的反饋,使用戶能夠更直觀地理解數(shù)據(jù)的變化。無(wú)論是簡(jiǎn)單的計(jì)數(shù)器還是復(fù)雜的數(shù)據(jù)可視化,你都可以使用Streamlit的小部件和回調(diào)函數(shù)來(lái)實(shí)現(xiàn)實(shí)時(shí)數(shù)據(jù)更新,為用戶提供更好的交互體驗(yàn)。
7 、圖像展示
? ? ? 在Streamlit中,你可以使用各種圖像展示技術(shù)來(lái)向用戶展示圖像,包括照片、圖表、繪圖等。圖像展示可以幫助用戶更生動(dòng)地理解數(shù)據(jù)和信息。以下是關(guān)于如何在Streamlit中進(jìn)行圖像展示的詳細(xì)說(shuō)明:
1)、展示靜態(tài)圖像
? ? ? ?你可以使用st.image()
函數(shù)來(lái)展示靜態(tài)圖像,例如照片、圖表、logo等。以下是一個(gè)示例,展示如何展示一張靜態(tài)圖片:
? ? ? ?在這個(gè)示例中,我們使用st.image()
函數(shù)展示了一張示例圖片。通過(guò)指定caption
參數(shù)和use_column_width=True
,你可以添加圖像的標(biāo)題和使圖像寬度自適應(yīng)應(yīng)用程序的布局。
2)、展示動(dòng)態(tài)圖像
? ? ? ?你還可以展示動(dòng)態(tài)圖像,例如使用Matplotlib創(chuàng)建的動(dòng)態(tài)圖表。以下是一個(gè)示例,展示如何展示一個(gè)動(dòng)態(tài)的正弦曲線圖:
在這個(gè)示例中,我們首先創(chuàng)建了一個(gè)動(dòng)態(tài)圖像,展示了正弦曲線。然后,我們?cè)谝粋€(gè)循環(huán)中更新圖像的數(shù)據(jù),從而實(shí)現(xiàn)動(dòng)態(tài)效果。
3)、圖像交互和可視化
? ? ? ?結(jié)合小部件和圖像展示,你可以創(chuàng)建交互式的圖像可視化。以下是一個(gè)示例,展示如何使用滑動(dòng)條來(lái)調(diào)整圖像的顯示效果:
? ? ? ?在這個(gè)示例中,用戶可以使用滑動(dòng)條來(lái)調(diào)整正弦曲線的振幅,實(shí)時(shí)觀察圖像的變化。
? ? ? ?通過(guò)圖像展示,你可以向用戶呈現(xiàn)圖像、圖表和可視化結(jié)果,使他們更好地理解數(shù)據(jù)和信息。無(wú)論是靜態(tài)圖像還是動(dòng)態(tài)圖表,你都可以使用Streamlit的圖像展示功能來(lái)創(chuàng)造生動(dòng)的交互體驗(yàn)。
8、集成外部資源
? ? ? ?在Streamlit中,你可以集成外部資源,如文檔、鏈接和嵌入式內(nèi)容,以豐富你的應(yīng)用程序。這樣可以使用戶能夠獲取更多信息,與其他內(nèi)容進(jìn)行互動(dòng),或者展示來(lái)自其他平臺(tái)的數(shù)據(jù)。以下是關(guān)于如何在Streamlit中集成外部資源的詳細(xì)講解:
1)、鏈接和文本
? ? ? ?你可以使用st.write()
函數(shù)來(lái)添加鏈接和文本,以將用戶引導(dǎo)到其他資源或提供更多信息。以下是一個(gè)示例,展示如何添加外部鏈接和文本說(shuō)明:
在這個(gè)示例中,我們使用st.write()
函數(shù)添加了一個(gè)外部鏈接,指向Streamlit官方網(wǎng)站。用戶可以點(diǎn)擊鏈接以獲取更多信息。
2)、嵌入式內(nèi)容
? ? ? ?你還可以使用st.markdown()
函數(shù)來(lái)嵌入Markdown格式的內(nèi)容,以顯示嵌入式資源,如YouTube視頻、圖表等。以下是一個(gè)示例,展示如何嵌入YouTube視頻:
? ? ? ?在這個(gè)示例中,我們使用st.markdown()
函數(shù)嵌入了一個(gè)YouTube視頻,用戶可以直接在應(yīng)用程序中觀看視頻。
3)、顯示外部圖片
? ? ? ?你可以使用st.image()
函數(shù)來(lái)展示外部圖片,例如通過(guò)URL加載的圖像。以下是一個(gè)示例,展示如何展示一張外部圖片:
? ? ? ?在這個(gè)示例中,我們使用st.image()
函數(shù)展示了一個(gè)通過(guò)URL加載的外部圖片。
? ? ? ?通過(guò)集成外部資源,你可以為你的應(yīng)用程序添加額外的內(nèi)容和互動(dòng)性,使用戶能夠訪問(wèn)其他有關(guān)信息、觀看媒體內(nèi)容或與外部數(shù)據(jù)進(jìn)行交互。這可以為用戶提供更豐富的體驗(yàn)和信息。
9、自定義樣式
? ? ? ?在Streamlit中,你可以通過(guò)自定義樣式來(lái)使你的應(yīng)用程序與品牌一致,或者以獨(dú)特的方式呈現(xiàn)。你可以使用CSS樣式表來(lái)調(diào)整應(yīng)用程序的外觀和布局。以下是關(guān)于如何在Streamlit中進(jìn)行自定義樣式的詳細(xì)講解:
1)、自定義CSS樣式
? ? ? 你可以通過(guò)在Streamlit應(yīng)用程序中使用HTML和CSS代碼來(lái)自定義樣式。你可以使用st.markdown()
函數(shù)添加包含HTML和CSS代碼的Markdown文本。以下是一個(gè)示例,展示如何自定義按鈕的顏色:
? ? ? ?在這個(gè)示例中,我們使用st.markdown()
函數(shù)添加了包含自定義CSS代碼的Markdown文本。然后,我們?cè)趹?yīng)用程序中使用HTML代碼來(lái)創(chuàng)建一個(gè)自定義樣式的按鈕。
2)、使用外部CSS文件
? ? ? ?如果你有一個(gè)獨(dú)立的CSS文件,你可以使用st.markdown()
函數(shù)中的<link>
標(biāo)簽將其導(dǎo)入到應(yīng)用程序中。以下是一個(gè)示例,展示如何使用外部CSS文件來(lái)自定義樣式:
*首先,在與應(yīng)用程序相同的目錄下,創(chuàng)建一個(gè)名為styles.css
的CSS文件,并添加自定義樣式代碼。
*在Streamlit應(yīng)用程序中,使用st.markdown()
函數(shù)導(dǎo)入外部CSS文件:
在這個(gè)示例中,我們?cè)趹?yīng)用程序中使用st.markdown()
函數(shù)導(dǎo)入了外部CSS文件。然后,我們?cè)趹?yīng)用程序中使用HTML代碼來(lái)應(yīng)用自定義樣式。
3)、自定義全局樣式
? ? ? ?除了單獨(dú)的組件樣式外,你還可以使用st.markdown()
來(lái)自定義全局樣式。以下是一個(gè)示例,展示如何自定義全局字體和顏色:
? ? ? ? 在這個(gè)示例中,我們使用st.markdown()
函數(shù)來(lái)應(yīng)用自定義的全局樣式,包括字體和顏色。
4)、自定義樣式的注意事項(xiàng)
當(dāng)你使用自定義樣式時(shí),確保它不會(huì)影響到Streamlit的核心布局和功能,以免產(chǎn)生不可預(yù)測(cè)的結(jié)果。
了解HTML和CSS基礎(chǔ)是非常有幫助的,這樣你可以更好地掌控自定義樣式。
在添加不安全的HTML和CSS代碼時(shí),使用
unsafe_allow_html=True
參數(shù)來(lái)明確表示你的意圖。
通過(guò)自定義樣式,你可以將你的Streamlit應(yīng)用程序變得更加獨(dú)特和個(gè)性化,以便更好地與你的品牌或主題保持一致。
10、結(jié)論
通過(guò)本文,你已經(jīng)了解了如何安裝Streamlit以及它的主要功能,包括數(shù)據(jù)可視化、交互式小部件、數(shù)據(jù)表格展示、文本和說(shuō)明、交互式過(guò)濾和篩選、實(shí)時(shí)數(shù)據(jù)更新、圖像展示、集成外部資源、自定義樣式和部署?,F(xiàn)在,你可以開始創(chuàng)建你自己的交互式數(shù)據(jù)應(yīng)用程序了!