如何在 d3.js 旭日形图中的节点上设置初始 .focus()？

Question

我正在努力使this sunburst chart 可访问/508 兼容。有没有人知道我怎么能说，中心圆使用 .focus() 调用带有默认焦点？那样的话，每当用户与仅限于键盘导航的用户进行交互时，起点总是突出显示中心圆？

我对无障碍标准相当陌生。但我想要完成的是双边键盘导航。任何建议将不胜感激！

Answer 1

原则上，实现这一点的最简单方法是在根元素上设置一个 ID 并选择它（例如使用document.getElementById()），然后对其调用.focus()。

当您使用 NVD3 之类的库时，它并没有真正为您提供那种灵活性，但特别是对于根元素，它仍然很容易使其工作。 sunburst 由一组path 元素组成，第一个元素代表根。所以你需要做的就是选择容器的第一个path子元素，获取DOM节点并调用.focus()：

d3.select(".nv-sunburst").select("path").node().focus();