@antv/g-plugin-a11y NPM | npm.io

1.1.4 • Published 8 months ago

Install

Weekly downloads

-

License

MIT

Repository

Last release

8 months ago

@antv/g-plugin-a11y

Inspired by:

Getting Started

Install and register this plugin:

import { Plugin } from '@antv/g-plugin-a11y';

const plugin = new Plugin({
    enableExtractingText: true,
});
canvasRenderer.registerPlugin(plugin);

Features

enableExtractingText

Extracts all visible text content from the canvas and makes them searchable by the browser (command + F) and SEO friendly.

const plugin = new Plugin({
    enableExtractingText: true,
});
canvasRenderer.registerPlugin(plugin);

We create a DOM layer called g-a11y-text-extractor-mask which contains text content used in current canvas:

<div
    id="g-a11y-text-extractor-mask"
    style="position: absolute; inset: 0px; z-index: 99; pointer-events: none; user-select: none; overflow: hidden;"
>
    <div
        id="g-a11y-text-extractor-text-94"
        style="line-height: 1; position: absolute; white-space: pre; word-break: keep-all; color: transparent !important; transform-origin: 0px 0px; transform: translate(0px, 0px) translate(-50%, -100%) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 320, 350, 0, 1); font-size: 10px; font-family: sans-serif;"
    >
        Humidity
    </div>
</div>

There are the following considerations:

SVG natively supports this feature, so we won't append the mask.
Since the minimum fontsize in Chrome is 12px, this may cause inconsistencies.

@babel/runtime tslib @antv/g-lite

@infinitebrahmanuniverse/nolb-_antv @everything-registry/sub-chunk-71

8 months ago

9 months ago

9 months ago

9 months ago

9 months ago

9 months ago

9 months ago

10 months ago

11 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago