Streamlit：快速构建可视化网页（数据科学必备）

luckzack

发布于 2023-09-29 09:18:37

8370

发布于 2023-09-29 09:18:37

很多算法工程师在完成数据分析、模型训练或者项目总结的时候，往往只能通过ppt汇报，添加数据图表、截图模型实验结果等。如果想提供一个前端演示demo，通常可以搭建flask服务，但是flask需要学习很多前端知识，如css、html等，这又是一个深之又深的坑。那有没有什么工具能够跳过这些模块，直接提供一个可用的前端页面呢？答案是肯定的，今天给大家推荐一个轻量化、简单好用、快速上手的streamlit。

1 streamlit

1.1 什么是streamlit？

streamlit 是2019年开源的python库，在GitHub上已经超过了17k的stars了。AI算法工程师利用streamlit可以快速构建机器学习应用和高级数据分析可视化的用户界面。更多内容和介绍可以参考streamlit的官方帮助文档

1.2 快速上手

pip安装

pip install streamlit

安装好以后，执行如下命令，可以运行内置演示界面hello

streamlit hello

如果你想停止运行，可以随时在命令行里使用Ctrl+C终止应用。

然后可以创建自己的python脚本app.py

import streamlit as st
st.title("Streamlit Demo")
st.write("Hello Word!")

在python脚本的目录下，在终端中启动服务。

streamlit run app.py

执行后会在8501端口启动服务，如果启动成功则显示如下URL。

本地浏览器打开该URL，则为刚刚创建的前端页面

1.3复杂功能

1.3.1支持markdown语法

可以把平时写markdown的习惯保留下来，用到前端页面排版上去。

st.markdown("""
## 代码片段
import streamlit as st
import pandas as pd
import numpy as np
data = pd.DataFrame(np.random.randn(20,3), columns=['line1', 'line2', 'line3'])
st.line_chart(data)
""")

前端输出结果：

1.3.2 数据展示

import streamlit as st
import pandas as pd
import numpy as np
data = pd.DataFrame(np.random.randn(20,3), columns=['line1', 'line2', 'line3'])
st.write(data.head(10))

前端输出结果：

1.3.3 自带画图

import streamlit as st
import pandas as pd
import numpy as np
data = pd.DataFrame(np.random.randn(20,3), columns=['line1', 'line2', 'line3'])
st.line_chart(data)

前端输出结果：

streamlit支持的所有图类型如下：

折线图 line_chart
条形图 bar_chart
面积图 area_chart

1.3.4 Matplotlib

matplotlib大家应该不陌生，这是python常用的画图工具。streamlit也支持该画图结果的展示。

import streamlit as st
import numpy as np
import matplotlib.pyplot as plt
import pandas as pd
data = pd.DataFrame(np.random.randn(20,3), columns=['line1', 'line2', 'line3'])

st.title("matplotlib")
st.subheader("histogram")
fig_mp, ax_mpl = plt.subplots()
ax_mp = plt.hist(data)
plt.xlabel("x")
plt.ylabel("y")
st.pyplot(fig_mp)

前端输出结果：

1.3.5 Plotly

import streamlit as st
import numpy as np
import pandas as pd
data = pd.DataFrame(np.random.randn(20,3), columns=['line1', 'line2', 'line3'])
import plotly.express as px

st.title("plotly")
st.subheader("histogram")
fig = px.histogram(data)
st.plotly_chart(fig)

前端输出结果：