构建您的第一个Streamlit应用上传、图表与筛选第一部分在本教程中您将学习如何将一个简单的Streamlit脚本转变为一个强大的数据探索工具。您将创建一个能够加载并分析数据集、交互式可视化数据模式、并筛选导出结果的应用——全程无需编写JavaScript。本课程是Streamlit应用系列的一部分Streamlit入门学习部件、布局与缓存构建您的第一个Streamlit应用上传、图表与筛选第一部分本篇教程构建您的第一个Streamlit应用上传、图表与筛选第二部分将Streamlit与某云数据平台集成构建实时云端数据应用第一部分将Streamlit与某云数据平台集成构建实时云端数据应用第二部分若要学习如何使用Streamlit无缝上传、探索、可视化和导出数据请继续阅读。为何首选数据探索器在深入模型、仪表盘或某云数据平台连接之前每个数据项目都始于一个通用步骤——理解数据。无论您是验证特征工程的数据科学家、清理原始CSV的分析师还是检查数据漂移的机器学习工程师您总是需要一种快速、可靠的方式来查看数据集。“数据探索器”模式正是为此最通用的基础。它简单到足以进行快速实验又强大到可以成为可复用的内部工具。仅需几个Streamlit原语——文件上传、图表和缓存——您就能构建一个轻量级界面节省数小时的笔记本调试和邮件往来。Streamlit在此处表现出色因为它消除了代码与洞察之间的摩擦。您可以将您喜爱的库例如pandas、Altair、matplotlib直接连接到UI部件让队友在不接触代码的情况下与您的逻辑交互。不再分享静态报告而是分享一个应用用户可以按自己的方式探索、切片和导出。本课聚焦于此——一个精简但真实的示例展示了为何Streamlit已成为分析学和机器学习原型开发的首选工具。图2数据探索器作为洞察的共享工具连接数据科学家、数据分析师、数据工程师和教育者于一个协作环境中——桥接分析、工程和学习实现统一的数据驱动决策。配置您的开发环境要遵循本指南您需要在系统上安装Streamlit及几个支持库。幸运的是Streamlit可以通过pip安装并适用于所有主流平台。pipinstallstreamlit1.38,2pandas2.2,3altair5.2,6安装后验证一切配置正确python -cimport streamlit, pandas; print(streamlit.__version__, pandas.__version__)您应该在终端中看到版本号确认您的环境已准备就绪。辅助模块回顾理解数据与可视化工具在深入lesson2_main.py之前让我们重新审视那些为应用默默提供支持的轻量级辅助模块。这些模块使主Streamlit文件保持清洁和模块化将配置、数据访问和可视化关注点分离。pyimagesearch/data_loader.py读取与复用数据集该模块抽象了文件读取逻辑以便您在所有课程中复用相同的加载器。fromfunctoolsimportlru_cacheimportpandasaspdfromtypingimportOptional,IO导入库非常精简pandas用于读取CSV文件。functools中的lru_cache用于简单的内存缓存——这样如果重复加载同一个文件每次重新运行后不会每次都从磁盘重新读取。类型提示Optional,IO帮助编辑器如VS Code提供自动补全和静态检查。lru_cache(maxsize1)defload_iris_sample(path:str)-pd.DataFrame:returnpd.read_csv(path)此函数读取捆绑的鸢尾花样本数据集。lru_cache(maxsize1)装饰器确保即使Streamlit在每个部件更改时重新运行脚本CSV文件在每个Python进程中仅被加载一次。如果切换数据集或重启应用缓存会自动重置。defload_uploaded_csv(file_obj:IO[bytes])-pd.DataFrame:returnpd.read_csv(file_obj)第二个辅助函数处理应用中任意的CSV上传。它接受st.file_uploader返回的类文件对象并将其直接读入DataFrame。此处未使用缓存——每个上传的文件都是唯一的按文件对象缓存可能会导致用户或会话间结果混淆。图4一个简单的数据加载流程——无论是通过load_iris_sample()使用内置样本还是通过load_uploaded_csv()上传自定义CSV——两者都馈入一个共享的DataFrame驱动应用UI。pyimagesearch/config.py集中式设置fromdataclassesimportdataclassimportosconfig.py存储多个课程复用的常量和配置逻辑。对于本课只有一个字段是重要的default_sample_path:stros.path.join(data,iris_sample.csv)所有其他字段均与某云数据平台连接性有关并将在后续课程中发挥作用。即使将小值集中在此也能使您的Streamlit脚本保持声明式且整洁。应用自定义主题增添一丝精致在深入完整的Streamlit应用之前让我们让它看起来更专业一些。默认情况下Streamlit使用浅色主题但只需几行配置您就可以完全重新设计应用样式。Streamlit中的主题通过存储在.streamlit/目录下的简单TOML文件控制。这允许您全局自定义背景、文本和强调色无需CSS。创建主题文件在您的项目根目录下如果.streamlit文件夹不存在请创建它然后添加一个名为config.toml的新文件[theme] base dark primaryColor #FF4B4B backgroundColor #0E1117 secondaryBackgroundColor #262730 textColor #FAFAFA此配置应用了一个现代深色主题base将整个应用切换到深色模式。primaryColor定义强调色按钮和高亮颜色。backgroundColor和secondaryBackgroundColor控制页面和侧边栏颜色。textColor设置所有部件和标签的前景色。Streamlit如何加载它当您运行时Streamlit会自动检测并应用.streamlit/config.toml文件streamlit run lesson2_main.py无需额外的导入或代码更改。这非常理想因为主题设置保持纯粹的声明式——您可以调整颜色、字体或布局行为而无需触及您的Python脚本。提示扩展主题您还可以在此处设置其他UI范围的参数例如页面布局和字体样式[server] headless true enableCORS false [client] toolbarMode minimal这些选项在部署到云环境或将应用嵌入内部仪表盘时可能很有用请根据您的安全需求仔细审查CORS设置。至此您的应用感觉更加协调——深色背景使数据表和图表更加突出强调色也与您的视觉风格保持一致。接下来我们将逐步构建第二课的应用本身——逐页解析lesson2_main.py代码解释导航、数据处理和可视化如何协同工作。)st.sidebar.caption(“第二课演示应用”)此处您使用**侧边栏单选按钮**引入了一个简单的单页面导航模式。 每个选择设置变量page您将在后续使用if page ...代码块渲染相应部分。 这种模式感觉像是多个页面但仍在一个文件中非常适合在过渡到pages/文件夹结构之前的小型原型。 **图8** 侧边栏显示导航项列表其中“概览”被选中 #### 显示概览页面 python base_df get_base_data() if page 概览: st.header(概览) st.write(基础数据集预览) st.dataframe(base_df.head()) st.write(形状:, base_df.shape) st.code(st.cache_data 缓存返回值以加速重新运行。)当选择概览时您调用get_base_data()一次并将其结果存储在base_df中。您显示一个标题、数据集的前五行预览及其形状行×列。最后您包含一个代码片段提醒用户关于缓存的知识强化入门课程中的关键概念。此页面既作为完整性检查也作为用户在探索更深页面之前的定位点。图9概览页面显示鸢尾花数据集预览表和形状信息此结构为何重要即使在这个阶段也能看到3个最佳实践模块化数据加载被抽象成一个函数因此未来只需替换路径即可更换数据集。状态简洁屏幕上显示的一切都可以从缓存的DataFrame重新派生。声明式UI布局通过您想显示什么来描述而不是如何渲染它。这个干净的基础让您可以扩展到更复杂的部分即图表、筛选器和上传而无需重构。接下来我们将扩展到探索页面您将在其中使用Altair添加第一个交互式图表。探索页面交互式散点图探索页面是本课第一个真正的“顿悟”时刻您将从静态表格转向实时的、交互式图表。此页面允许用户使用来自visualization.py的可复用辅助函数iris_feature_scatter()生成的散点图比较数据集的两个数值特征。代码块elifpage探索:st.header(交互式散点图)numeric_cols[cforcinbase_df.columnsifcnotin{species}]xst.selectbox(X轴,numeric_cols,index0)yst.selectbox(Y轴,numeric_cols,index1)chartiris_feature_scatter(base_df,x,y)st.altair_chart(chart,use_container_widthTrue)工作原理页面标题st.header(交互式散点图)创建一个清晰的视觉分隔并标记当前页面上下文。选择数值列numeric_cols [c for c in base_df.columns if c not in {species}]。此处我们动态检测所有数值列过滤掉分类型目标列species。这确保用户只选择适合绘图的变量。轴选择部件两个下拉菜单让用户选择在X轴和Y轴上绘制哪些数值特征。每次用户更改选择时Streamlit都会重新运行脚本即时更新图表。渲染图表辅助函数构建带有内置悬停工具提示和流畅交互性的Altair图表。传递use_container_widthTrue确保图表适应页面的完整列宽这对于在各种屏幕尺寸上查看仪表盘至关重要。为何在此使用辅助函数将绘图逻辑封装在iris_feature_scatter()中可以使主脚本保持可读性并避免重复。您以后可以为其他类鸢尾花数据集复用同一个辅助函数甚至将其参数化以通过用户选择的分类型列例如color_col为点着色。图10探索页面截图显示散点图上方的两个下拉菜单“X轴”和“Y轴”悬停在点上时可显示工具提示。您所学到的如何以声明方式将部件连接到可视化。Streamlit的重新运行模型如何即时反映状态变化。为何Altair非常适合快速、交互式的探索性数据分析EDA界面。接下来我们将在第二部分继续讲解上传页面用户可以在该页面导入自己的CSV文件并在应用中直接预览或分析它们。FINISHED更多精彩内容 请关注我的个人公众号 公众号办公AI智能小助手或者 我的个人博客 https://blog.qife122.com/对网络安全、黑客技术感兴趣的朋友可以关注我的安全公众号网络安全技术点滴分享