就算你不会 Web 开发，也能让数据“动”起来的开源项目

作者：HelloGitHub-吱吱

这里是HelloGitHub 推出的《讲解开源项目》系列，今天要向小伙伴们介绍的是一个能够快速地把数据制作成可视化、交互页面的 Python 框架：Streamlit，分分钟让你的数据动起来！

犹记得我在做机器学习和数据分析方面的毕设时，曾经为了制作精美的图表而抓耳挠腮，曾经为了在页面可视化、交互式展示数据而绞尽脑汁。现在摆在我们面前的是一个能够快速可视化数据并且制作成交互页面的 Python 框架，仅需几分钟就可以快速构建和部署功能强大的数据应用程序，写到这里 Streamlit 的高傲已经尽数体现了。

Streamlit - The fastest way to build and share data apps

下面我们就一起来上手这个强大的 Python 数据可视化框架吧！

一、浅尝辄止

1、本地实验环境：Python 3.6 - Python 3.8。

2、安装 Streamlit 体验官方提供的 hello world 小 demo。

pip install streamlitstreamlit hello

3、运行上述命令后会自动打开 Streamlit 的初始页面 localhost:8501/。

4、通过左边栏可以选择四个内置小项目并查看其代码，例如分形动画、折线图和层叠地图等，能在网页上点击选择设置一些参数，动态查看效果。

二、熟能生巧

通过 Streamlit 提供的接口，完美避开 Django 和 Flask 框架，无需编写 HTML、CSS、JavaScript 代码，与魔幻的前端 say goodbye。

2.1 开发自己的 app

1、首先创建一个 Python 文件，命名为test.py，导入 Streamlit 库。

import streamlit as st

2、通过如下命令启动项目，Ctrl + c 即可结束项目。

# filename 自己的 py 文件名称streamlit run [filename]

3、当应用程序正在运行时，每次修改 Python 文件并保存，网页都会弹出提示“Source file changed”，可以选择“Rerun”或者“Always rerun”，使得页面能够重新刷新。忽略掉小小的等待时间，我们能够在快速交互循环中「所见即所得」。

4、我们在任何时候对网页内容进行更新，包括：修改源码、使用者和网页进行交互（点击网页的按钮、输入文本），Streamlit 都是自上而下扫描解析并且运行整个代码。

2.2 基础命令

2.2.1 显示文本

2.2.2「魔法」

我愿称之为懒人命令——用尽量少的代码达到同样的效果。在不调用任何 Streamlit 方法的情况下，当用户自定义的变量出现在单行中，等同于 st.write() 效果。

也可以将''' 和' 包裹的内容直接显示。

2.2.3 显示数据表

Streamlit 能从多个不同角度快速、交互的可视化数据，原始数据、图表、JSON 数据等皆可。

2.2.4 绘制图表和地图

Streamlit 支持多种流行的数据图表库，如 Matplotlib、Altair、deck.gl 等。

2.2.5 显示多媒体

动动鼠标即可将图像、视频和音频文件直接嵌入 Streamlit 应用程序。

2.2.6 交互式小部件

盯：漂亮的按钮、滑块、输入框等小部件。每次用户与小部件交互时，Python 脚本都会重新执行，并且该小部件的输出值会在运行期间设置为新值。

1、按钮button。

if st.button('HelloGitHub'): st.write('Subscribe our channels~')

2、复选框checkbox。

ret = st.checkbox('I love HelloGitHub!')if ret: st.write('Me too~')

3、滑块slider，可以选择 int / float / data / time / datetime 等类型。

age = st.slider('HelloGitHub 几岁了?', 0, 10, 1)st.write("HelloGitHub ", age, ' 岁了~')

4、常用的命令列举

2.2.7 显示进程和状态

1、进度条progress。

2、spinner：在执行代码块时临时显示一条消息。

3、其他

2.2.8 性能优化

Streamlit 使用@st.cache 装饰器使得页面能够快速“无痕”刷新。当我们给函数打上cache 标记时，Streamlit 在碰到该函数的时候会检查三个值：函数名称、函数体、输入参数。如果发现这三个值的组合第一次出现，则会运行函数，并且将结果存储在本地缓存中。当下次调用该函数时，如果这三个值没有改变，则 Streamlit 会跳过函数执行，直接读取本地缓存返回结果。

2.2.9 布局设置

1、将交互小部件放入侧边栏。

2、表单st.form()：将元素与“提交”按钮一起处理。

3、插入列并排的容器

2.3 修改配置

1、查看所有的配置选项：streamlit config show。

2、Windows 系统可以在%userprofile%/.streamlit/config.toml 全局文件下或者在当前运行 Streamlit 的文件夹下建立.streamlit/config.toml 文件进行设置。

3、某些配置例如外观、主题等点击网页上的Settings 也可轻松选择。

2.4 在 Streamlit sharing 上部署、管理和共享

1、将自己的项目代码上传到 GitHub 的共有仓库，添加需求文件以管理任何外部依赖项，例如requirements.txt 等。

2、在 streamlit.io/sharing 上注册账号并且申请邀请「Request an invite!」。收到邀请电子邮件后，即可使用该平台部署管理。

3、选择New app 在Deploy an app 中填入相应信息即可。

4、若应用程序有很多依赖项，则第一次部署可能需要一些时间，最终应用程序可以使用如下链接访问：

share.streamlit.io/[user name]/[repo name]/[branch name]/[app path]

三、精益求精

到此，Streamlit 框架的基本接口和用法都已经讲完啦！更多详情还需要友友们在实践中探索，并将指令成功“嵌入”到自己的项目中。

很多命令在文档的「API cheat sheet」中都可以快速搜索到，希望很快就能够在 Streamlit Gallery 上看到大家分享的应用，可以留言给我地址我会去把玩的~。

最后，您的关注和宝贵三连「收藏、点赞、转发」，是对我们 HelloGitHub 莫大的支持，我们将会为您源源不断推送新鲜、有趣的开源项目。

HelloGitHub 分享 GitHub 上有趣、入门级的开源项目。