1. 基本信息
| 项目 | 内容 | 数据来源 |
|---|---|---|
| 名称 | build-web-data-visualization-openai-plugins | — |
| 作者/维护者 | OpenAI 官方仓库 openai/plugins |
GitHub API |
| 来源链接 | https://github.com/openai/plugins/tree/main/plugins/build-web-data-visualization | — |
| 许可证 | MIT（插件清单 .codex-plugin/plugin.json 内声明；子目录未附独立 LICENSE 文件） |
仓库文件内容 |
| GitHub Stars / Forks | 所属仓库 4,833★ / 649 forks（属整个合集仓库 160+ 插件共享，不代表本插件个体热度，取证方式见第 6 章） | GitHub API |
| 最新版本 | 插件清单声明 0.1.21；子目录最近一次实质性提交为 2026-06-08 | GitHub API（commits） |
| 安装方式 | Codex 插件市场一条命令安装；其他 Agent 需手动复制 skills/ 子目录 |
仓库 README |
2. 功能介绍与亮点
build-web-data-visualization 是 OpenAI 官方发布的网页数据可视化技能包，由 18 个子技能组成，覆盖图表选型、实现、测试、无障碍与叙事包装的完整链路。
核心能力：
- 技术选型分流：先判断该用声明式语法（Vega-Lite/Observable Plot）、D3 手写、Canvas2D 高密度渲染，还是 Three.js/WebGL 场景，再路由到对应专项子技能。
- 场景化指导：仪表盘与实时可视化（流数据、降采样、性能预算）、地理空间与制图（投影选型、8 种地图库取舍）、统计与不确定性可视化（分布、置信区间的诚实呈现）、甘特图、UML/软件架构图。
- 交付层：报告/PDF/幻灯片导出、滚动叙事（scrollytelling）、URL 可分享状态设计。
- 质量层：无障碍与包容性可视化（键盘、屏幕阅读器、色彩对比度）、专门的可视化测试子技能（含 Playwright 视觉回归模板）。
- 每个子技能自带独立参考文档与配套模板（复核清单、图表简报模板等），技能本体只输出指导性 Markdown 与代码骨架，不含可自动执行的脚本，最终代码由 Agent 参照指导自行编写。
亮点：①OpenAI 官方出品，子目录近两个月内仍有实质内容提交；②MIT 协议明确、无付费依赖；③贯通“选型 → 实现 → 测试 → 无障碍 → 交付叙事”全链路，而非只聚焦单一图表库或视觉风格。
3. 适用场景
固定分类：数据分析与可视化。
面向需要在网页端构建图表、仪表盘、地图或复杂交互可视化的前端与数据团队：从“这份数据该用哪种图”的选型困惑，到无障碍合规复核、报告/幻灯片导出，或为公开数据故事做滚动叙事包装的场景均可覆盖。
4. 跨 Agent 兼容性
- Codex：✅ 原生支持——通过官方插件市场一条命令安装，每个子技能内置
agents/openai.yaml声明触发策略。 - Claude Code：⚠️ 需适配——子技能均为纯 SKILL.md + Markdown 文档，未见 Codex 专属工具调用，理论上可手动复制
skills/<子技能>目录到~/.claude/skills/使用，但官方未提供该安装路径的文档。 - OpenClaw：⚠️ 需适配——理由同上。
- Hermes Agent：❓ 未验证——已抓取材料未提及。
5. 推荐理由
网页数据可视化是前端与数据团队的高频需求，但常见做法要么依赖 Agent 凭经验挑图表库，要么每次从零试错。这个技能包由 OpenAI 官方维护，把“选哪种可视化技术、怎么设计地图与仪表盘、怎么保证统计诚实与无障碍、怎么测试和交付”整理成 18 份可复用的专家级指导文档，内容只是 Markdown 与代码模板，不执行脚本、不外发数据，安装门槛低，适合希望 Agent 稳定产出高质量可视化的团队。
6. 评分
| 维度 | 分数 | 说明 |
|---|---|---|
| 受欢迎程度 | 7 | 所属合集仓库 4,833★ 由 160+ 插件共享，不计入本插件个体热度；本插件子目录 2026-06-08 仍有实质内容提交（而非仅版本号批量提升），但第三方平台目前未检索到专门讨论或媒体报道，故按“官方持续投入维护、但缺乏独立第三方讨论证据”评定 |
| 可用性 | 9 | 18 个子技能均配完整参考文档、检查清单与代码模板；Codex 插件市场一条命令安装；子目录近 2 个月内有实质提交；MIT 协议，无付费依赖 |
| 安全性 | 9 | 见下方检查清单 |
| 综合 | 8.3 | 三项均值 |
安全检查清单：
- Shell 命令及权限范围：未发现任何可自动执行的脚本；仅有 3 个 .ts 文件是 Playwright 测试起始模板，供参考改写，不会自动运行
- 联网外发：无任何网络调用，技能本体是纯本地 Markdown 指导与代码模板
- API key/凭据：不涉及，使用该技能不需要任何账号或密钥
- 可疑指令：逐份审阅子技能全文，未见混淆代码、越权指令或 prompt injection 迹象
- 作者/组织信誉：OpenAI 官方仓库，信誉最高档
- License 是否明确：明确，MIT（插件清单声明）
- 最近维护时间：子目录 2026-06-08 有实质提交，距今约 7 周
7. 跟同类 Skills 相比的优势
| 对比对象 | 定位 | 与本技能的差异 |
|---|---|---|
| tufte-data-viz（caylent） | 只读图表设计规则集，把 Tufte 图表美学原则转化为 22 条可执行规则，覆盖 Recharts/ECharts/Chart.js/matplotlib/Plotly/D3 等库 | 只解决“图表该长什么样”的视觉风格问题；不涉及地图、仪表盘架构、无障碍测试或交付叙事等更宽的场景决策 |
| lieflat-charts | 模板驱动的单色编辑感可视化，内置 Lupi 编辑叙事、Glance 快速判断等固定视觉风格家族，产出零构建单文件 HTML | 聚焦一种特定的“编辑感”视觉语言与预设模板库，风格高度统一但可选范围窄；不覆盖地理空间、实时仪表盘等技术选型判断 |
| antv-g2-chart（antvis/chart-visualization-skills） | AntV 官方为 G2 v5 图表库打造的代码生成技能，强约束防幻觉，174 个测试用例验证代码通过率 | 深耕单一图表库（G2）的代码正确性与语法约束；本技能覆盖面更广，是“该用哪种可视化技术”的上层选型与场景指导，两者可搭配使用 |
8. 用户评价
该技能目前在第三方平台尚无具名用户评价；检索到的唯一相关页面是聚合类插件目录站点对该插件基本信息的转载列表，不构成独立评价内容。
9. 安装使用方式
方式一：Codex 插件市场（官方推荐）
在 Codex 中执行插件安装命令，选择 build-web-data-visualization 插件即可一次性装入全部 18 个子技能。
方式二：手动复制（其他 Agent）
克隆 openai/plugins 仓库后，将 plugins/build-web-data-visualization/skills/<子技能名> 目录复制到目标 Agent 的技能目录，可按需只复制用得上的子技能。
安装后无需重启；技能基于 SKILL.md 的 description 字段自动匹配触发，涉及图表、仪表盘、地图或可视化实现与测试等话题时自动加载。
10. 注意事项
技能内容为指导性文档与代码模板，最终图表代码仍需自行编写并测试；Codex 之外的生态官方未提供安装文档，需手动复制且可能随仓库结构调整失效；部分子技能引用的第三方地图服务可能各自要求 API Key 或使用条款；OpenClaw、Hermes Agent 暂无官方兼容性声明。