Accessibility

D3plus includes many accessibility features right out of the box. These features are usually derived automatically by the provided data, but can also be overrided by the developer.

SVG Attributes

  <svg class="d3plus-viz" role="img"
    aria-labelledby="
      48cb9407-a891-4630-878f-62f4b797a974-title
      48cb9407-a891-4630-878f-62f4b797a974-desc
      ">

    <title id="48cb9407-a891-4630-878f-62f4b797a974-title">
      Bar Chart of Income Over Time
    </title>

    <desc id="48cb9407-a891-4630-878f-62f4b797a974-desc">
      The income in Massachusetts has been rising steadily over the past 10 years.
    </desc>

    ...

  </svg>
  

Shape Attributes

  <rect class="d3plus-Shape d3plus-Rect d3plus-id-alpha"
    aria-label="2. alpha, 29."
    role="presentation"
    opacity="1"
    shape-rendering="geometricPrecision"
    pointer-events="visiblePainted"
    width="300" height="371"
    x="-150" y="-185.5"
    fill="#b22200"
    fill-opacity="1"
    rx="0" ry="0"
    stroke="rgb(125, 24, 0)"
    stroke-dasharray="0"
    stroke-linecap="butt"
    stroke-opacity="1"
    stroke-width="0"
    vector-effect="non-scaling-stroke">
  </rect>