之前介绍过两个数据展示的组件,st.dataframest.table

今天介绍的st.data_editor组件,除了展示数据的功能更加强大之外,还可以编辑数据。

1. 概要

st.data_editor组件在数据展示和编辑中都发挥着独特且重要的作用。

首先,在数据展示方面,它的优势在于:

  1. 直观性:以表格形式展示数据,使得数据更加直观易懂。通过该组件可以方便地查看数据集的整体结构和细节
  2. 适应性:能够自动适应屏幕宽度,并支持水平或垂直滚动,确保用户能方便地浏览整个数据集
  3. 交互性:支持对数据进行排序、筛选和搜索等操作,增强了数据的可读性和交互性

在数据编辑方面,优势也很明显:

  1. 灵活性:支持类电子表格编辑,可以在界面上直接对数据进行增删改操作,无需通过代码实现,提高了数据编辑的灵活性
  2. 定制性:提供了丰富的列定制选项,如通过st.column_config可以设置列的标题、类型、格式以及编辑属性(如最小/最大值或步长)等,以满足不同场景下的数据编辑需求
  3. 多数据类型支持:支持多种数据类型的数据编辑,包括数值、文本、日期、时间等,使得数据编辑更加全面和便捷
  4. 状态管理:具有状态管理机制,可以记录用户的编辑操作,并在必要时进行回滚或提交。这使得数据编辑过程更加安全和可控

2. 基本用法

st.data_editor组件多用在需要实时编辑数据的情况,它主要参数有:

名称 类型 说明
data - 任何适合渲染成表格的数据类型
width int 数据编辑器的宽度,单位 px
height int 数据编辑器的高度,单位 px
use_container_width bool 是否使用父容器宽度
hide_index bool 是否隐藏索引列
column_order [str] 指定列的显示顺序
column_config dict 配置列的显示方式,例如标题、可见性、类型或格式,以及编辑属性等等
num_rows str 控制用户是否可以在数据编辑器中添加和删除行
disabled bool 或 [str] 是否禁用编辑
key str 组件名称,具有唯一性

这里重点关注两个参数,datacolumn_config

data这个参数支持的数据类型非常宽泛,具体包括:pandas.DataFrame, pandas.Series, pandas.Styler, pandas.Index, pyarrow.Table, numpy.ndarray, pyspark.sql.DataFrame, snowflake.snowpark.DataFrame, list, set, tuple, dict等等。

几乎所有常用的存储数据的结构都包含了。

column_config这个参数可以高度定制列的显示和编辑行为,极大的增强了st.data_editor的能力,

在后面的高级用法中会详细介绍。

2.1. 使用示例

下面通过一个根据实际应用简化的示例来演示st.data_editor基本用法。

我们构建一个简单的产品库存管理系统,通过一个界面来展示和编辑产品的库存数据。

上面用st.data_editor来编辑表格数据,下面用st.dataframe同步显示编辑后的数据。

import streamlit as st
import pandas as pd # 模拟产品库存数据
inventory_data = pd.DataFrame(
{
"Product ID": [1, 2, 3],
"Product Name": ["Apple", "Banana", "Cherry"],
"Quantity": [100, 150, 200],
"Price": [0.5, 0.3, 1.0],
}
) # 使用st.data_editor展示和编辑库存数据
st.title("产品库存管理系统")
edited_inventory = st.data_editor(
inventory_data,
width=600,
height=300,
num_rows="dynamic",
) # 显示编辑后的数据(可选,此处仅为展示效果)
st.write("编辑后的库存数据:")
st.dataframe(edited_inventory)

3. 高级用法

结合column_config参数,我们可以高度定制st.data_editor的列的显示和编辑行为。

比如:

  1. 自定义列显示:设置列的标题、帮助信息、格式等,使数据编辑器的界面更加友好和易读
  2. 控制列编辑行为:指定列的数据类型、最小值、最大值、步长等,从而控制用户对该列的编辑行为。例如,可以将一列设置为数字类型,并限制其输入范围
  3. 添加特殊类型的列:支持多种特殊类型的列,如图表列、进度条列、链接列等,这些特殊类型的列可以提供更丰富的数据展示和编辑体验

3.1. 使用示例

下面我们构建一个学生成绩管理系统,使用st.data_editor展示和编辑学生成绩,

并通过st.column_config定制列的显示和编辑行为。

下面的示例中,定义了每个列的标题,同时定义了各科目的最高分和显示的format

import streamlit as st
import pandas as pd # 模拟学生成绩数据
student_grades = pd.DataFrame(
{
"Student Name": ["Alice", "Bob", "Charlie"],
"Math": [125, 90, 140],
"Science": [38, 20, 34],
"English": [88, 114, 96],
}
) # 定义列配置
column_config = {
"Student Name": {"label": "学生姓名"},
"Math": st.column_config.NumberColumn(
label="数学成绩",
min_value=0,
max_value=150,
format="%d 分",
),
"Science": st.column_config.NumberColumn(
label="科学成绩",
min_value=0,
max_value=40,
format="%d 分",
),
"English": st.column_config.NumberColumn(
label="英语成绩",
min_value=0,
max_value=120,
format="%d 分",
),
} # 使用st.data_editor展示和编辑学生成绩,并应用列配置
st.title("学生成绩管理系统")
edited_grades = st.data_editor(
student_grades,
width=500,
height=300,
column_config=column_config,
num_rows="dynamic",
) # 显示编辑后的数据(用于确认更改)
st.write("编辑后的学生成绩:")
st.dataframe(edited_grades)

下面构造一个更复杂的列的示例,其中使用了下拉框进度条柱状图作为列。

注意,进度条柱状图的列是不能编辑的。

# 模拟项目数据
project_data = pd.DataFrame(
{
"Project Name": ["Project A", "Project B", "Project C"],
"Status": ["In Progress", "Completed", "Pending"],
"Progress": [60, 100, 30], # 进度百分比
"Sales": [
[1000, 1500, 500],
[200, 500, 1500],
[1800, 500, 1000],
], # 销售额
}
) # 定义状态选项列表
statuses = ["In Progress", "Completed", "Pending", "On Hold"] # 定义列配置
column_config = {
"Project Name": {"label": "项目名称"},
"Status": st.column_config.SelectboxColumn(
"状态",
options=statuses,
),
"Progress": st.column_config.ProgressColumn(
"进度",
min_value=0,
max_value=100,
format="%d%%", # 显示百分比
),
"Sales": st.column_config.BarChartColumn(
"销售额变化",
y_min=100,
y_max=2000,
),
} # 使用st.data_editor展示和编辑项目数据(不包含图表列)
st.title("项目管理系统")
edited_projects = st.data_editor(
project_data,
width=500,
height=300,
column_config=column_config,
num_rows="dynamic",
)

4. 总结

总之,st.data_editorStreamlit中一个功能强大的组件,它提供了类似电子表格的方式在线编辑DataFrame或其他类似结构的数据,直观易用。

然而,它也存在一些劣势,如状态管理复杂性性能问题以及定制化限制等。

在实际应用中,需要根据具体需求权衡利弊,并结合Streamlit的其他组件和Python的强大生态来实现更复杂的数据处理和分析功能。

『玩转Streamlit』--可编辑表格的更多相关文章

  1. Github 恶搞教程(一起『玩坏』自己的 Github 吧)

    最近在伯乐在线读到一篇趣文,<如何在 Github『正确』做贡献>,里面各种能人恶搞 Github 的『Public contributions』,下面截取几个小伙伴的战绩: 顺藤摸瓜,发 ...

  2. 2018-2019-2 20165221『网络对抗技术』Exp4:恶意代码分析

    2018-2019-2 20165221『网络对抗技术』Exp4:恶意代码分析 实验要求: 是监控你自己系统的运行状态,看有没有可疑的程序在运行. 是分析一个恶意软件,就分析Exp2或Exp3中生成后 ...

  3. 2017-2018-2 20155303『网络对抗技术』Exp9:Web安全基础

    2017-2018-2 『网络对抗技术』Exp9:Web安全基础 --------CONTENTS-------- 一.基础问题回答 1.SQL注入攻击原理,如何防御? 2.XSS攻击的原理,如何防御 ...

  4. 2018-2019-2 20165225『网络对抗技术』Exp2:后门原理与实践

    2018-2019-2 20165225『网络对抗技术』Exp2:后门原理与实践 一.实验说明 任务一:使用netcat获取主机操作Shell,cron启动 (0.5分) 任务二:使用socat获取主 ...

  5. 2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践

    2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践 一 免杀原理与实践说明 (一).实验说明 任务一:正确使用msf编码器,msfvenom生成如jar之类的其他文件, ...

  6. 2017-2018-2 20155303『网络对抗技术』Exp2:后门原理与实践

    2017-2018-2 『网络对抗技术』Exp2:后门原理与实践 --------CONTENTS-------- 1. 后门原理与实践实验说明 2. 常用后门工具 NC或netcat Win获得Li ...

  7. 2017-2018-2 20155303『网络对抗技术』Exp4:恶意代码分析

    2017-2018-2 20155303『网络对抗技术』Exp4:恶意代码分析 --------CONTENTS-------- 一.原理与实践说明 1.实践目标 2.实践内容概述 3.基础问题回答 ...

  8. 2017-2018-2 20155303『网络对抗技术』Exp1:PC平台逆向破解

    2017-2018-2 『网络对抗技术』Exp1:PC平台逆向破解 --------CONTENTS-------- 1. 逆向及Bof基础实践说明 2. 直接修改程序机器指令,改变程序执行流程 3. ...

  9. # 2017-2018-2 20155319『网络对抗技术』Exp6:信息收集与漏洞扫描

    2017-2018-2 20155319『网络对抗技术』Exp6:信息收集与漏洞扫描 实践内容 (1)各种搜索技巧的应用 (2)DNS IP注册信息的查询 (3)基本的扫描技术:主机发现.端口扫描.O ...

  10. # 2017-2018-2 20155319『网络对抗技术』Exp2:后门原理与实践

    2017-2018-2 20155319『网络对抗技术』Exp2:后门原理与实践 1.实验准备 一.实验说明 任务一:使用netcat获取主机操作Shell,cron启动 (0.5分) 任务二:使用s ...

随机推荐

  1. elementUI实现月、季度、年 时间选择框

    elementUI实现月.季度.年 时间选择框 一.通过 el-date-picker 组件来实现月.年的选择 代码如下: <el-date-picker v-if="dateType ...

  2. 小tips:前端容易读错的单词列表

    排名第一的是width,音标/wɪdθ/,发/i/的音,不是发/ai/的音: hidden音标/ˈhɪdn/发/i/的音,不是发/ai/的音: hide音标/haɪd/,发/ai/的音: float音 ...

  3. 搭建ipv6并发代理池

    声明 本文章中所有内容仅供学习交流,抓包内容.敏感网址.数据接口均已做脱敏处理,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请联系我立即删除! 学习目标 ounter(l ...

  4. CSS – BEM (Block__Element--Modifier)

    前言 BEM 是一种 CSS class 命名规范. 目的是防止大家名字取太短, 不小撞名字后果很麻烦. 参考: Youtube – You Probably Need BEM CSS in Your ...

  5. CSS – 冷知识 (新手)

    <img> extra 4px at the bottom 参考: Extra 4px at the bottom of html <img> The mysterious 4 ...

  6. CSS – word-break, overflow-wrap, word-wrap, white-space

    参考 word-break 和 word-wrap 的区别 (我以为这篇已经很厉害了) 彻底搞懂word-break.word-wrap.white-space (没想到, 这一篇更厉害) white ...

  7. DenseFusion复现

    试了一下原版的pytorch1.0.0,可能时间太长了,许多版本都不被支持,没弄成,另找到一个项目适配pytorch1.7.1 租云服务器.配置RTX3090 pytorch1.7 使用termius ...

  8. .NET 工具库高效生成 PDF 文档

    前言 QuestPDF 是一个开源 .NET 库,用于生成 PDF 文档.使用了C# Fluent API方式可简化开发.减少错误并提高工作效率.利用它可以轻松生成 PDF 报告.发票.导出文件等. ...

  9. react native 环境搭建遇到问题

    关于pod install 慢的要死的问题 解决方法记录     开始时显示ruby有问题,卸载cocoapods重装的   然后启动不起来,到ios目录下执行 pod install   然后太慢尝 ...

  10. 八字测算引流seo程序php网页版黄历/排盘/抽签/星座/生肖/解梦整站程序分享

    2演示站: https://s31.yczfcn.com/ 2源码说明: 1.手机端和PC端共两套模板,手机端访问时候自动跳转至手机端模板和域名. 2.本程序包含文章系统,结合自身的免费测算功能,适合 ...