256 lines
10 KiB
Markdown
256 lines
10 KiB
Markdown
## 一、streamlit介绍
|
||
|
||
### 1、简介
|
||
|
||
streamlit是一个开源的[python库](https://so.csdn.net/so/search?q=python%E5%BA%93\&spm=1001.2101.3001.7020)，能够快速帮助用户创建定制化的web应用，特别是在机器学习和数据科学领域。
|
||
|
||
### 2、特点
|
||
|
||
**1. API简明易用**\
|
||
API（Application Program Interface）非常友好，结构清晰，容易上手\
|
||
2\. 无需掌握前端开发知识，如html，JavaScript，css等就可以构建web应用\
|
||
（1）封装大量常用组件方法，支持大量数据表、图表等对象的渲染，支持网格化、**2.响应式布局**\
|
||
（2）渲染语言为Markdowm；支持HTML文本的渲染。所以也能嵌入HTML或CSS等代码块到应用中\
|
||
**3. 社区资源丰富**\
|
||
（1）官方论坛非常活跃<https://discuss.streamlit.io/>\
|
||
（2）官方文档提供了丰富的实例和源码<https://docs.streamlit.io/library/api-reference>\
|
||
能让创作者专注于内容和后端业务的实现，但是又能够生成基于web的GUI，无需在前端耗费大量心力
|
||
|
||
## 二、streamlit学习笔记
|
||
|
||
### 1、markdown文本
|
||
|
||
* 用markdowm格式显示内容，直接使用st.markdowm()初始化，调用不同的方法，往文档中填入内容
|
||
|
||
```python
|
||
st.markdown('Streamlit is **_really_ cool**.')
|
||
st.markdown("This text is :red[colored red], and this is **:blue[colored]** and bold.")
|
||
st.markdown(":green[$\sqrt{x^2+y^2}=1$] is a Pythagorean identity. :pencil:")
|
||
|
||
123
|
||
```
|
||
|
||
|
||
|
||
* **st.title()**：文章大标题
|
||
* **st.header()**：显示一级标题
|
||
* **st.subheader()**：显示二级标题
|
||
* **st.text()**：显示固定格式的文本
|
||
* **st.caption()**：显示小字体文本
|
||
* **st.code()**：显示代码块
|
||
* **st.latex()**：latex公式
|
||
* **st.divider()**：显示全局规则
|
||
|
||
### 2、数据显示支持
|
||
|
||
* **st.table()**：普通的表格，用户静态数据的展示
|
||
|
||
```python
|
||
df = pd.DataFrame(
|
||
np.random.randn(4, 3),
|
||
columns=('列 %d' % i for i in range(3)))
|
||
|
||
st.table(df)
|
||
|
||
12345
|
||
```
|
||
|
||
|
||
|
||
* **st.dataframe()**：高级的表格，可以进行数据的操作，比如排序等
|
||
|
||
```python
|
||
df = pd.DataFrame(
|
||
np.random.randn(10, 5),
|
||
columns=('列 %d' % i for i in range(5)))
|
||
|
||
st.dataframe(df.style.highlight_max(axis=0))
|
||
|
||
12345
|
||
```
|
||
|
||
\
|
||
还有n多种样式，如：\
|
||
highlight\_null：空值高亮\
|
||
highlight\_min：最小值高亮\
|
||
highlight\_max：最大值高亮\
|
||
highlight\_between：某区间内的值高亮
|
||
|
||
* **json字符串显示**
|
||
* 
|
||
* **监控组件metric**
|
||
|
||
```python
|
||
col1, col2, col3 = st.columns(3)
|
||
col1.metric("Temperature", "70 °F", "1.2 °F")
|
||
col2.metric("Wind", "9 mph", "-8%")
|
||
col3.metric("Humidity", "86%", "4%")
|
||
|
||
1234
|
||
```
|
||
|
||
|
||
|
||
### 3、图表可视化支持
|
||
|
||
#### 原生图表组件
|
||
|
||
* **st.line\_chart()**：折线图
|
||
|
||
```python
|
||
chart_data = pd.DataFrame(
|
||
np.random.randn(20, 3),
|
||
columns=['a', 'b', 'c'])
|
||
|
||
st.line_chart(chart_data)#折线图
|
||
st.area_chart(chart_data)#面积图
|
||
st.bar_chart(chart_data)#柱状图
|
||
|
||
|
||
12345678
|
||
```
|
||
|
||
|
||
|
||
* **st.area\_chart()**：面积图\
|
||
|
||
* **st.bar\_chart()**：柱状图\
|
||
|
||
* **st.map()**：地图（经纬线）
|
||
|
||
```python
|
||
df = pd.DataFrame(
|
||
np.random.randn(1000, 2) / [50, 50] + [37.76, -122.4],
|
||
columns=['lat', 'lon'])
|
||
|
||
st.map(df)
|
||
|
||
12345
|
||
```
|
||
|
||
|
||
|
||
#### 外部图表组件：借助于其他库实现
|
||
|
||
* **st.pyplot()**：显示matplotlib格式的图像
|
||
* **st.altair\_chart()**
|
||
* **st.vega\_lite\_chart()**
|
||
* **st.plotly\_chart()**
|
||
* **st.bokeh\_chart()**
|
||
* **st.pydeck\_chart()**
|
||
* **st.graphviz\_chart()**
|
||
|
||
### 4、用户操作支持
|
||
|
||
* **st.button**（显示内容）：按钮
|
||
* **st.download\_button（）**：下载按钮
|
||
* \*\*file\_uploader：\*\*文件上传
|
||
* **checkbox**：复选框
|
||
* **radio**：单选框
|
||
* **selectbox**：下拉单选框
|
||
* **mutiselect**：下拉多选框
|
||
* **slider**：滑动条
|
||
* **select\_slider**：选择条
|
||
* **text\_input**：文本输出框
|
||
* \*\*text\_area:\*\*文本展示框
|
||
* **number\_inpu**t：数字输入框，支持加减按钮
|
||
* **data\_input**：日期选择框
|
||
* **time\_input**：时间选择框
|
||
* **color\_picker**：颜色选择器
|
||
* **camera\_input**：调用用户的摄像头获取一张图片
|
||
|
||
### 五、多媒体组件
|
||
|
||
* **st.image()**：显示一张图片或一组图片
|
||
* **st.audio()**：播放音频
|
||
* **st.video()**：播放视频\
|
||
|
||
|
||
### 6、状态组件
|
||
|
||
* **progress**：进度条，如游戏加载进度，运行进度等
|
||
* **Spinner**:等待提示
|
||
* **Balloons**:页面底部飘气球，表示祝贺
|
||
* **Snow**:页面下雪花，表示祝贺
|
||
* **Error**:显示错误信息
|
||
* **Warning**:显示警告信息
|
||
* **Info**:显示信息
|
||
* **Success**:显示成功信息
|
||
* **exception**:显示异常信息（代码错误栈）\
|
||
\
|
||
\
|
||
|
||
|
||
### 7、页面布局和容器
|
||
|
||
* **st.sidebar**：显示在侧边栏
|
||
* **st.columns**：列容器，处在同一个columns内的组件，按照从左至右顺序展示\
|
||
|
||
* **st.tabs**：划分容器\
|
||
|
||
* **st.container**：包含多个组件的容器\
|
||
|
||
* **st.expander**：包含多个可以扩展的容器\
|
||
|
||
* **st.empty**：包含单组件的容器
|
||
|
||
### 8、流程控制系统
|
||
|
||
streamlit是自上而下逐步渲染出来的
|
||
|
||
* **st.stop()**：可以让streamlit应用停止而不向下执行，如验证码通过后，再向下运行显示后续内容
|
||
* **st.experimental\_rerun()**：重新执行脚本
|
||
* **st.form()**：表单，streamlit在某个组件有交互后就会重新执行页面程序，而有时候需要等一组组件都完成交互后再刷新（如登录填写用户名和密码），这个时候就需要将这些组件添加到form中
|
||
* st.form\_submit\_button()：在form中使用，提交表单\
|
||
|
||
|
||
### 9、云端部署
|
||
|
||
可以部署再streamlit cloud或其他公有云上，生成一个公网url随时访问，详细步骤可以查看相关官方手册<https://docs.streamlit.io/streamlit-community-cloud>
|
||
|
||
### 10、其他
|
||
|
||
* **Session state**是一种在每个用户会话的重新运行之间共享变量的方法。除了存储和持久化状态的功能外，Streamlit 还公开了使用回调操作状态的功能。会话状态还会在[多页应用](https://docs.streamlit.io/library/get-started/multipage-apps)内的应用之间持续存在。
|
||
* **多页面应用**：使用st.set\_page\_config(page\_title=“页面标题”,page\_icon=“页面图标”)，[多页APP创建方法](https://docs.streamlit.io/library/get-started/multipage-apps/create-a-multipage-app)\
|
||
随着应用的增长，仅仅使用选择框用于选择要显示的页面，维护起来需要大量额外的开销，并且无法使用自定义单个页面标题，无法使用URL在页面之间导航。
|
||
* **为用户个性化应用**：st.experimental\_user 返回关于streamlit上的私有应用程序的登录用户的信息\
|
||
|
||
* **缓存特性提升速度：**\
|
||
当用户在页面上做一些操作的时候，比如输入数据，都会触发整个 streamlit 应用代码的重新执行，如果其中有读取外部数据的步骤（数 GB 的数据），那这种性能损耗是非常可怕的。\
|
||
但 streamlit 提供了一个缓存装饰器，当要重新执行代码渲染页面的时候，就会先去缓存里查一下，如果代码或者数据没有发生变化，就直接调用缓存的结果即可。\
|
||
使用方法也简单，在需要缓存的函数加上 @st.cache 装饰器或其他装饰器即可。\
|
||
|
||
|
||
|
||
|
||
|
||
# 在生产环境中，通常会使用 nohup 命令来确保进程在关闭终端后继续运行，并将输出重定向到一个文件。完整命令如下：
|
||
nohup streamlit run interview/app.py --server.port 5055 > streamlit.log 2>&1 &
|
||
|
||
# 查看端口占用
|
||
sudo netstat -tuln | grep 5055
|
||
sudo netstat -tuln | grep 5065
|
||
|
||
pkill -f "streamlit run interview/app.py"
|
||
```
|
||
|
||
你可以将这两个命令写入一个脚本文件（例如 `restart_streamlit.sh`），然后在每次更新文件后运行这个脚本：
|
||
|
||
```bash
|
||
#!/bin/bash
|
||
pkill -f "streamlit run interview/app.py"
|
||
nohup streamlit run interview/app.py --server.port 5055 > streamlit.log 2>&1 &
|
||
```
|
||
|
||
确保脚本具有可执行权限：
|
||
|
||
```bash
|
||
chmod +x restart_streamlit_interview_java.sh
|
||
```
|
||
|
||
然后每次更新文件后运行脚本：
|
||
|
||
```bash
|
||
./restart_streamlit.sh
|
||
```
|