Skip to content

Example Visualization ​

We'll use BokehJS to create a stacked bar chart. You can use any visualization method—Bokeh is not required.

Why Bokeh?

Bokeh renders to Canvas, demonstrating that Data Navigator works even with pixel-based output. This shows accessibility can be added to any visualization library.

The Chart ​

The Accessibility Problem ​

Try tabbing through this chart with your keyboard. You can't interact with it at all.

Bokeh renders this as a <canvas> element—pure pixels. There's nothing for a keyboard to focus on, nothing for a screen reader to announce.

What We'll Build ​

By the end of this tutorial, you'll transform this chart so users can:

  1. Enter using a button or keyboard shortcut
  2. Navigate between all 4 data points using arrow keys
  3. Hear descriptions via screen reader
  4. Exit cleanly to continue browsing

Next Steps ​

Let's learn about Structure.

Released under the MIT License.