2026年可访问数据可视化工具：
一套可用的技术选型
五款库主导了现代数据可视化领域，但只有部分库将屏幕阅读器视为一等消费者。这是一份面向实际工程场景的评分表，专为2026年需要将图表发布到生产环境的团队而写。
1. 决定图表是否无障碍的五个维度
”无障碍图表”这个说法背后隐藏着一系列静默而各异的要求。一张柱状图可以用SVG渲染出完美的色彩对比度，但对键盘用户而言仍不可达。它可以支持键盘导航，但对屏幕阅读器依然没有任何有用的播报。它可以清晰地播报数值，但在第一个工具提示处就让视力低下的用户止步。为了公平比较各库，我们对每款库在五个独立维度上进行评估，这五个维度直接映射了真实辅助技术用户体验可视化的方式。
这五个维度并非个人偏好列表，而是WCAG 2.2成功标准（1.4.11非文本对比度、2.1.1键盘、4.1.2名称角色值）的实践转译，以及WAI-ARIA创作实践指南关于图表和图形的指导，和W3C研究问题工作组自2023年起流传的”数据可视化无障碍”草案说明。每款图表库都会生成SVG；每款库都会渲染某种图例；每款库都对颜色有自己的态度。区别在于默认值——当您写下最少量的合理代码时得到的图表。
1. 带语义ARIA的SVG输出。该库是否输出SVG（而非canvas），且该SVG是否携带有意义的角色、标签和分组结构，而非匿名的<g>嵌套？
2. 默认即色盲安全调色板。分类和顺序调色板是否开箱即经过色觉障碍测试，还是需要用户主动覆盖才能达到要求？
3. 键盘可导航数据点。视力正常的纯键盘用户能否Tab进入图表，用方向键在标记间切换，并读取每个标记的值？
4. 屏幕阅读器描述层级。是否存在标题、一句话摘要，以及每个系列/每个数据点的播报——而不仅仅是单一的alt文本堆砌？
5. 替代表格视图。底层数据是否可作为HTML表格，从图表链接或紧邻图表渲染，供偏好表格消费的用户使用？
“一张具有完美对比度和色盲安全调色板却没有键盘模型的图表，是一张您只为一半受众渲染的图表。”
2. 参与评测的五款库
五款库覆盖了2026年绝大多数新建图表项目：Vega-Lite、Plotly、Observable Plot、Apache ECharts和D3自定义代码。它们在抽象层次上各有侧重——Vega-Lite最具声明性，D3最具命令性——且每款库对无障碍的态度各不相同。我们将D3单独处理，因为”D3+自定义”在工程上是一个根本不同的命题：您获得的无障碍性，就是您自己编写的无障碍性。
这些库没有一款对无障碍怀有敌意。它们全部生成SVG（Plotly和ECharts也可输出canvas；我们评估SVG模式）。它们都接受任意色彩调色板。问题在于：当您写下最少量的合理代码时得到的是什么，以及需要多少改造才能使那个默认图表真正通过WCAG 2.2 AA。
D3的”零点”评级并非对这款库的批评——它是对原始D3构建所能获得内容的如实描述。D3是原语。D3图表的无障碍性，就是作者自己编写的无障碍性。由了解ARIA的工程师创作的D3图表可以是页面上无障碍程度最高的图表；由不具备这方面知识的工程师创作的D3图表，几乎必然是页面上无障碍程度最低的图表。
3. 评分矩阵：库×无障碍特性
第一节的五个维度，与第二节的五款库交叉评分。“是”表示默认行为满足该维度；“部分”表示该库暴露了正确的钩子但默认不启用；“手动”表示工程师需要从零手写相关代码。
| Vega-Lite | Plotly.js | Observable Plot | Apache ECharts | D3 + 自定义 | |
|---|---|---|---|---|---|
| 带语义ARIA的SVG输出 | 是（SVG，带标题分组） | 是（SVG，ARIA标签） | 是（SVG，标记角色） | 部分（canvas为默认；SVG渲染器需手动开启） | 手动 |
| 默认即色盲安全调色板 | 是（Tableau 10 + viridis） | 部分（Plotly默认；色觉障碍调色板需手动开启） | 是（Observable categorical10） | 部分（默认配色方案未经色觉障碍测试） | 手动 |
| 键盘可导航数据点 | 部分（图例可聚焦；标记需配置） | 是（2.x中的方向键导航） | 部分（tip插件可聚焦；标记需手动） | 部分（无障碍模块需手动开启） | 手动 |
| 屏幕阅读器描述层级 | 是（description规范属性） | 部分（单一标题；每个数据点需手动开启） | 是（ariaLabel + ariaDescription标记） | 部分（无障碍模块输出每系列alt文本） | 手动 |
| 替代表格视图 | 部分（数据表格易于渲染） | 部分（可导出CSV；无DOM内表格） | 部分（data()辅助函数，无自动表格） | 部分（工具箱支持数据视图） | 手动 |
Vega-Lite和Observable Plot在声明性默认值上领先。Plotly在内置键盘导航上领先。ECharts的opt-in无障碍模块是本列表中最完整的——但前提是您启用它。D3给您的既是一无所有，也是一切皆有：每个单元格都是”手动”，因为该库没有任何立场。这些库中没有一款是一行代码的解决方案；但凡用心，它们都是可行的。
4. 好图表与差图表：同一份数据，两种实现
矩阵展示了每款库暴露的能力；本节展示实际工程师会怎么写。同一份数据，两种实现。“差”的版本上手快，在27英寸显示器上看起来没问题。“好”的版本多了12行代码，并通过了矩阵上的每一个维度。
// Vega-Lite — 仅使用默认值
{
"data": { "url": "complaints.csv" },
"mark": "bar",
"encoding": {
"x": { "field": "category", "type": "nominal" },
"y": { "field": "count", "type": "quantitative" },
"color": { "field": "category" }
}
}可渲染，看起来没问题。屏幕阅读器没有图表标题，没有描述，标记上没有键盘模型，默认色彩方案在实际类别数量下未经色觉障碍测试，没有备用表格。
// Vega-Lite — 无障碍默认值
{
"title": "按表面分类的投诉数量，2024",
"description":
"4605条网络无障碍投诉柱状图，按表面排名。最高：表单（1940条）。",
"data": { "url": "complaints.csv" },
"mark": { "type": "bar", "ariaRoleDescription": "bar" },
"encoding": {
"x": { "field": "category", "type": "nominal",
"axis": { "labelAngle": -30 } },
"y": { "field": "count", "type": "quantitative",
"title": "投诉数量" },
"color": {
"field": "category",
"scale": { "scheme": "tableau10" },
"legend": { "title": "表面" }
},
"tooltip": [
{ "field": "category", "title": "表面" },
{ "field": "count", "title": "投诉数量" }
]
},
"usermeta": { "embedOptions": { "ariaLabel": "投诉图表" } }
}标题、描述、色觉障碍安全调色板、命名坐标轴、命名工具提示字段、标记上的ARIA角色描述。与从同一数据集渲染的<table>配合使用，无需离开声明性语法即可通过矩阵上的每一个维度。
好图表不是另一张图表，它是同一张图表——将隐式默认值变为显式，写下标题，命名调色板，拼出每个标记的角色，并同时以表格形式提供数据。这就是全部的技巧所在。
五款库中没有一款自带”将图表渲染为表格”的默认模式。可用的模式是：将同一份数据绑定到两个组件——图表和其下方的HTML<table>，通常在视觉上隐藏，但通过”显示数据表格”切换按钮向辅助技术暴露，该按钮翻转hidden属性。这一模式每张图表约需20行框架代码，并在第一次用户研究会话中就能收回成本。
5. 按场景的具体推荐
2026年的库选型主要取决于工作流契合度。表中五款库均可行，问题是哪款与您实际交付的图表类型最匹配。五个常见场景，五个推荐，每个均附次优备选。
编辑/数据新闻图表（单图，精雕细琢）
推荐：Observable Plot，Vega-Lite紧随其后。Plot的标记式API免费提供每个标记的ARIA标签，分类调色板经过色觉障碍测试，SVG输出清晰易读。Vega-Lite位列次席，因为其description属性是所有库中最简洁的单属性屏幕阅读器摘要——但对于一次性编辑内容，Plot在默认人体工程学上更胜一筹。
分析师主导的仪表板（多图，声明性）
推荐：Vega-Lite，Observable Plot紧随其后。Vega-Lite的规范语法让分析师无需编写JavaScript即可在一个Notebook中组合30张图表，且schema的title + description属性无需额外配置即可提供屏幕阅读器层级结构。每张图表配合一个Vega渲染的数据表格，即可通过替代表格维度。
科学/BI仪表板（交互式探索）
推荐：Plotly.js，ECharts紧随其后。Plotly是本列表中唯一在2.x系列将标记间方向键导航作为默认功能发布的库。如果您的受众期望悬停、缩放和下钻，Plotly的内置键盘模型是决定性因素。ECharts只要启用aria模块即可赶上——但您必须主动启用。
高密度运营仪表板（数百个数据点，性能关键）
推荐：Apache ECharts（SVG渲染器+启用aria模块），Plotly紧随其后。ECharts对于非常密集的图表拥有本组中最强的性能表现，aria模块生成的每系列alt文本屏幕阅读器可正常处理。请关闭canvas渲染器；canvas更快，但无障碍树会消失。
任何库都无法渲染的定制编辑图表（完全定制，独一无二）
推荐：D3加手写无障碍层。手写层是不可缺少的：SVG根元素的<title> + <desc>，每个标记的role=“img”加aria-label，每个可聚焦标记的焦点模型，以及从同一数据集渲染的兄弟<table>。当图表真的在其他地方不存在时，D3是正确的工具；当图表只是一张柱状图、而有人出于习惯选了D3时，D3就是错误的工具。
图表库内的图表很少是页面上唯一的内容。仅在悬停时出现从不在聚焦时出现的工具提示、使用<div>而非<ul>的图例、页面重置样式表中被覆盖的焦点环、相对于页面背景对比度不足的颜色色块——这些都是任何图表库都不会为您修复的页面级失败。库给您标记；页面给您其余的一切。
结论：可用的技术选型是您写下来的那一套
表中五款库没有一款是错误答案。凡用点心思，所有这些库都能在大多数维度上达标。2026年预测无障碍图表最可靠的单一指标，并不是import行上的库名——而是团队是否在与设计系统同一处写下了”在本组织，无障碍图表”意味着什么。标题。描述。调色板。键盘模型。替代表格。CONTRIBUTING.md中的五行字；发布出去的图表与真正落地的图表之间的差距。
选择契合工作流的库，开启其无障碍默认值，每张图表都配上数据表格，并以审计图表本身同等的认真度审计图表周围的页面级外壳。这些库中任何一款的默认图表都可以做到无障碍。但这些库中没有任何一款的默认图表，在没有用心的情况下就是无障碍的。
“库给您标记；页面给您其余的一切。”