使用 Gradio 构建表格数据科学工作流：预测接口、交互式仪表盘与 skops 一键加载

表格数据是机器学习应用最广泛的领域，覆盖客户分群、流失预测、缺陷检测等大量业务场景。本文以产品缺陷预测为例，讲解如何借助 gr.Dataframe、gr.Gallery 等组件，在 gradio 中用少量代码把「数据输入—模型推理—结果展示」串成可交互的 Web 应用，并介绍基于 skops 与 gr.load() 实现的"一行代码"模型界面加载方案。读完本文，你将掌握：用可编辑的 DataFrame 组件接收表格输入、用 Gallery 组件组织多张分析图表，以及让 Hugging Face Hub 上的 scikit-learn 表格模型自动生成界面的原理与用法。

为什么表格数据科学工作流需要 Gradio

在表格数据科学工作的各个阶段——数据探索、特征分析、模型调优到向业务方汇报——"沟通展示"往往比建模本身更耗时。数据科学家经常要花数小时手工搭建一个接收 DataFrame、返回图表或预测结果的控制台/仪表盘脚本，而这些脚本既难以复用，也无法让非技术同事自助操作。本指南展示如何用 gradio 把这类工作流包装成可交互页面，并顺带介绍如何借助 skops 用一行代码加载完整的数据表格界面。

前置条件

请确保已安装 gradio Python 包，可参考仓库内的快速入门指南；示例代码还依赖 pandas、joblib、datasets、seaborn、matplotlib 等常用数据科学库。

构建第一个接口：基于产品信息预测生产故障

下面的代码基于产品生产信息构建一个故障预测界面：用户在表格中粘贴或录入若干行数据，模型为每行输出 0/1 的故障标签。

import gradio as gr
import pandas as pd
import joblib
import datasets


inputs = [gr.Dataframe(row_count = (2, "dynamic"), col_count=(4,"dynamic"), label="Input Data", interactive=1)]

outputs = [gr.Dataframe(row_count = (2, "dynamic"), col_count=(1, "fixed"), label="Predictions", headers=["Failures"])]

model = joblib.load("model.pkl")

# we will give our dataframe as example
df = datasets.load_dataset("merve/supersoaker-failures")
df = df["train"].to_pandas()

def infer(input_dataframe):
  return pd.DataFrame(model.predict(input_dataframe))

gr.Interface(fn = infer, inputs = inputs, outputs = outputs, examples = [[df.head(2)]]).launch()

下面对上述代码做逐项拆解：

• fn：推理函数，接收输入 DataFrame，返回各样本的预测结果。此处模型使用 joblib.load("model.pkl") 加载（对应 sklearn 模型的常见持久化方式）。
• inputs：接收输入的组件。这里定义为带 2 行 4 列的 DataFrame，初始形态是一张空表；当 row_count 设为 dynamic 后，表格的行数不依赖预定义大小，用户可在页面上动态增删行，因而可以一次输入单条或多条样本。
• outputs：承载输出的 DataFrame。推理返回每行 0 或 1 的单个标签列，所以配置 row_count 为 2、col_count 为 1（固定），并用 headers=["Failures"] 指定表头。
• examples：可让用户一键填入示例数据。示例既支持拖入 CSV 文件，也支持直接传 pandas DataFrame（本示例取数据集前两行），表头会被界面自动识别。

从源码看 gr.Dataframe 的关键参数

Dataframe 组件的参数定义在 gradio/components/dataframe.py 中，文档给出的上述写法对应旧版 tuple 语法，源码已对该形式给出 DeprecationWarning：

• 旧写法 row_count=(2, "dynamic") 是"初始行数 + 动态/固定"的组合；按源码注释，该 tuple 形式将在 Gradio 6.0 移除，届时建议改用 row_count=2 指定初始行数、row_limits=(最小行, 最大行) 约束增减范围（目前源码中 row_limits 仍处于待实现状态，会打印 UserWarning）。
• col_count 同样已标记为 deprecated，官方推荐迁移到 column_count。二者在构造函数内部经由 self.__process_counts() 统一归一化处理（见 gradio/components/dataframe.py），因此旧代码当前仍可运行。
• interactive 决定用户能否在页面上直接编辑表格；若未显式指定，Gradio 会根据组件作为输入还是输出来推断（详见源码中的 docstring，gradio/components/dataframe.py）。
• 除此之外，Dataframe 还支持 datatype（"str"、"number"、"bool"、"date"、"markdown"、"html"、"image"、"auto"，布尔列会渲染为复选框）、type（返回 pandas / numpy / polars / array 四种形态，gradio/components/dataframe.py）、max_height、column_widths、show_search、pinned_columns、static_columns 等实用配置，可在构造时按需组合。

交互背后的数据流

当用户在页面编辑 DataFrame 后，组件将数据封装为带 headers 与 data 字段的载荷传给 fn；后端在 preprocess 阶段依据 type 参数将其还原成 pandas.DataFrame、numpy 数组或 Python 二维列表后送入推理函数（gradio/components/dataframe.py）。这也是"输入表格 → 批量推理 → 表格输出"能无缝衔接的原因。若想查看更多 DataFrame 的实际用法，仓库内的 filter_records、matrix_transpose、tax_calculator、sort_records 等 demo 均是以表格为核心数据的可运行样例。

交互式探索分析：用 Gallery 组装多图仪表盘

在建模之前，数据科学家还需要做可视化探索。沿用上面训练模型用到的 merve/supersoaker-failures 数据集，我们可以把散点图、柱状图、相关性热力图一次性地呈现在一个仪表盘式页面里：

import gradio as gr
import pandas as pd
import datasets
import seaborn as sns
import matplotlib.pyplot as plt

df = datasets.load_dataset("merve/supersoaker-failures")
df = df["train"].to_pandas()
df.dropna(axis=0, inplace=True)

def plot(df):
  plt.scatter(df.measurement_13, df.measurement_15, c = df.loading,alpha=0.5)
  plt.savefig("scatter.png")
  df['failure'].value_counts().plot(kind='bar')
  plt.savefig("bar.png")
  sns.heatmap(df.select_dtypes(include="number").corr())
  plt.savefig("corr.png")
  plots = ["corr.png","scatter.png", "bar.png"]
  return plots

inputs = [gr.Dataframe(label="Supersoaker Production Data")]
outputs = [gr.Gallery(label="Profiling Dashboard", columns=(1,3))]

gr.Interface(plot, inputs=inputs, outputs=outputs, examples=[df.head(100)], title="Supersoaker Failures Analysis Dashboard").launch()

该示例同样围绕四个核心点组织：

• fn：根据输入数据生成图表的绘图函数。这里依次产出「测量量 13 与 15 的散点图（按 loading 着色）、failure 取值的柱状图、数值列相关性的热力图」，保存为 PNG 后以路径列表返回。
• inputs：与上一示例相同的 Dataframe 组件，让用户直接粘贴/编辑待分析数据。
• outputs：Gallery 组件负责集中展示所有可视化图表。
• examples：将数据集本身（这里取前 100 行）作为可一键加载的示例。

值得注意的是，fn 返回的图表会被 Gallery 自动识别与渲染；这种"函数产出图表列表 → Gallery 分栏展示"的模式，是构建数据剖析（profiling）仪表盘的通用套路，文首提到的完整版仪表盘在此基础上加入了更多图型与交互。

gr.Gallery 布局参数解读

Gallery 的实现位于 gradio/components/gallery.py，用于以图片/视频网格的形式展示媒体内容。构造参数 columns=(1, 3) 是一种响应式声明：它表示在最窄视口下每行 1 列、在较宽视口下每行最多 3 列。此外常用参数还包括：

• columns / rows：分别控制每行图片数与网格行数（gradio/components/gallery.py）。
• height：以像素或 CSS 单位设定组件高度，超出部分滚动。
• object_fit：缩略图的 CSS object-fit，可选 contain、cover、fill、none、scale-down。
• allow_preview / preview：控制点击缩略图是否放大预览、以及是否默认进入预览模式。
• type：作为输入组件时返回图片的形态（numpy / pil / filepath），作为输出时则不影响。

上例中 fn 返回的是文件路径字符串列表，Gallery 直接将其当作图片源渲染，无需额外类型转换；若返回的是 numpy 数组或 PIL 图像也会被组件原生支持（见 gradio/components/gallery.py 的 value 说明）。

一行代码加载表格模型界面：skops × gr.load

前述两个示例都需要手写组件配置，而 skops 与 gradio 的集成把这一过程压缩到了一行代码。skops 是构建在 huggingface_hub 与 scikit-learn 之上的库，负责把 sklearn 模型（含元信息）安全地序列化并推送到 Hub 上；结合 gradio 后，加载表格模型即可生成完整界面：

import gradio as gr

# title and description are optional
title = "Supersoaker Defective Product Prediction"
description = "This model predicts Supersoaker production line failures. Drag and drop any slice from dataset or edit values as you wish in below dataframe component."

gr.load("huggingface/scikit-learn/tabular-playground", title=title, description=description).launch()

这里的 gr.load(...) 是 gradio 的通用模型/空间加载入口，其定义在 gradio/external.py。加载一个 Hugging Face 模型时，Gradio 通过模型的推理管线类型自动判定界面形态：当任务属于 tabular-classification（表格分类）或 tabular-regression（表格回归）时，加载逻辑会自动构造一对 DataFrame 组件——输入侧为带真实列名的可编辑表格，输出侧为固定列 prediction 的结果表，并绑定相应的推理包装函数（gradio/external.py）。

一行代码背后的构造逻辑

• sklearn 模型通过 skops 推送到 Hub 时，模型仓库会附带一个 config.json，其中记录了示例输入（含列名）以及所解决的任务类型（tabular-classification 或 tabular-regression）。
• gr.load 读取这些信息后，从 config.json 对应的示例输入中取出列名、将其转换为若干示例行，填入生成的输入 DataFrame 作为 examples；同时输出组件会被构造为列名 prediction 的结果表（源码见 gradio/external.py）。
• 具体的数据整理发生在 gradio/external_utils.py 中：get_tabular_examples() 负责从模型仓库的 README.md 头部 YAML 解析示例数据并处理 nan 值（gradio/external_utils.py）；cols_to_rows() 把"列名 → 列数据"的字典转置为"行式"二维表（gradio/external_utils.py）；tabular_wrapper() 则封装了 tabular_classification / tabular_regression 两类推理调用，使界面函数能直接消费 DataFrame（gradio/external_utils.py）。
• 因此，用户拿到界面后既可以直接编辑表格单元格，也可以拖入数据切片一键预测——无需为每个模型重复编写 UI 代码。

若想把自己训练好的 sklearn 模型也变成这样的可复用界面，只需用 skops 将模型连同 config.json 元信息一起推送到 Hub（模型必须声明正确的表格任务类型），之后即可用上面同样的 gr.load 一行代码在任何地方加载它。

从预测到汇报：把整套工作流交给 Gradio

至此可以看到，gradio 针对表格数据科学工作流提供了一条非常顺畅的路径：

1. 探索阶段：用 gr.Dataframe + gr.Gallery 搭建交互式分析仪表盘，让探索性图表随数据切片实时刷新，替代"改参数 → 重跑脚本 → 肉眼比对"的笨重循环；
2. 建模阶段：把训练好的模型（如 joblib/skops 产物）接进 gr.Interface，让同事或客户自助粘贴 CSV 或编辑表格完成批量预测；
3. 分享阶段：借助 skops 的模型元信息与 gr.load 的自动界面构造，将整套表格任务（分类/回归）压缩为一行代码的共享应用。

三个环节复用的都是本仓库的同一批核心组件：Dataframe 负责表格数据的双向转换（gradio/components/dataframe.py），Gallery 负责媒体结果的聚合展示（gradio/components/gallery.py），而 Interface 作为快速应用容器把 fn/inputs/outputs/examples 组装成可直接 launch() 的 Web 服务。相关 demo（如 filter_records、matrix_transpose、sort_records、load_space）均可直接在本地运行，作为进一步定制的起点。若需要更精细的页面布局、多步骤交互或实时事件，还可升级到 gr.Blocks 编程模型继续扩展。