leaflet.a11y v0.6.0
Leaflet.a11y
An accessibility and localization/translation plugin for Leaflet.
- See: Changelog
- See: Roadmap
- Demo: nfreear.github.io/leaflet.a11y
Aim
This plugin does NOT replace accessibility efforts in core Leaflet. It is a means to provide interim fixes, and potentially to test fixes.
The aim for this plugin is for it to become obsolete and to retire it, because sufficient accessibility fixes and enhancements have been made to core Leaflet. For more see #14.
What is “A11y“?
“A11y“ is a numeronym – an abbreviation for accessibility. It is often pronounced “alley“ (see #10).
Leaflet.i18n plugin optional
If available, Leaflet.a11y
uses the Leaflet.i18n internationalisation plugin.
If the Leaflet.i18n
plugin is not available, a shim is provided for the L._()
translation function.
What it does
The plugin currently does the following:
- Set a
role
andaria-label
on the Leaflet map container element (see L-7193). - Manage keyboard focus when popups are opened and closed (see L-8115).
- Fix so non-interactive markers are correctly identified (L-8116)
- Enable map controls (Zoom in, Zoom out, Close popup, ...) to be translated into a language that has been set with
setLocale
(Leaflet.i18n). Mostly relevant for accessibility, as most text is hidden from visual users (L-9092).
More to follow!
Usage
Include or import
core Leaflet and the plugins:
<script src="path/to/leaflet.js"></script>
<script src="path/to/Leaflet.i18n.js"></script>
<script src="path/to/Leaflet.a11y.js"></script>
Then, simply set the a11yPlugin
option when creating a map:
var map = L.map('map', {
a11yPlugin: true
// ...
}).setView([51.505, -0.09], 13);
// ...
Build and Test
npm install
npm run build
npm test
npm start
Feedback, contributions and pull requests are welcomed!
License: MIT.