Companion d'accessibilité unifie pour les visualisations. Offre trois alternatives activables independamment : tableau de données, téléchargement CSV et description textuelle. Le contenu est replie dans un accordeon DSFR par défaut.

Attributs

Si ni table, ni download, ni description ne sont définis, les trois sont actives par défaut.

En attente d'un filtre

Sur une page d'exploration, l'amont peut refuser de charger tant qu'aucun filtre n'est posé (require-where sur <dsfr-data-source> ou <dsfr-data-query>). Le complément accessible annonce alors idle-message à la place de « aucune donnée disponible » : rien n'a été chargé, rien n'a échoué, et c'est cette nuance qu'un lecteur d'écran doit entendre. Le tableau et le bouton de téléchargement restent masqués tant que la source attend. Le mécanisme est décrit sur dsfr-data-source.

Le groupe non renseigné

Quand <dsfr-data-chart> porte empty-label, la barre du groupe vide (null, undefined ou chaîne vide) est nommée sur l'axe et dans la légende. Poser le même empty-label ici nomme la ligne correspondante du tableau équivalent, qui sinon a une cellule de libellé vide : le tableau dirait autre chose que le graphique qu'il double. Seule la colonne de libellé est concernée — label-field s'il est posé, sinon la première colonne rendue ; une mesure absente reste une cellule vide. Le CSV téléchargé porte le même libellé. Sans cet attribut, le rendu est celui d'avant : la valeur n'est pas reprise du graphique visé par for.

Un graphique multi-séries

Un jeu au format long — celui que produit dsfr-data-concat avec origin-field, et que <dsfr-data-chart series-field> consomme déjà — a une ligne par couple (libellé, série). Rendu tel quel, le tableau équivalent répète chaque libellé sans jamais dire de quelle série vient la valeur. Poser ici le même series-field pivote le tableau : une ligne par libellé, une colonne par série, la cellule de libellé en <th scope="row"> pour que chaque valeur garde ses deux coordonnées. Le CSV suit la même structure. L'attribut exige label-field et value-field : sans eux, le manque est signalé en console et le tableau reste à plat plutôt que pivoté de travers. Un couple absent des données laisse une cellule vide — le graphique y trace 0, le tableau ne l'affirme pas.

Fonctionnement ARIA

1. Le composant génère automatiquement un id s'il n'en a pas
2. Un skip link est injecte dans le graphique cible (visible au focus clavier)
3. aria-describedby pointe vers un resume concis dans le composant
4. aria-details pointe vers le tableau de données (si table est active)
5. A la deconnexion, tout est nettoye automatiquement

Exemples

<dsfr-data-chart id="mon-graph" source="data" type="bar"
  label-field="statut" value-field="total">
</dsfr-data-chart>
<dsfr-data-a11y for="mon-graph" source="data" table download></dsfr-data-a11y>

<dsfr-data-a11y for="mon-graph" source="data"
  table download
  description="Ce graphique montre la repartition des sites par statut.">
</dsfr-data-a11y>

<dsfr-data-chart id="mon-graph" source="data" type="bar"
  label-field="region" value-field="total"
  databox databox-title="Population par region"
  databox-download databox-screenshot>
</dsfr-data-chart>
<!-- Avec DataBox : pas de table ni download -->
<dsfr-data-a11y for="mon-graph" source="data"
  description="L'Ile-de-France concentre la majorite de la population.">
</dsfr-data-a11y>

<dsfr-data-a11y source="data"
  no-auto-aria table download>
</dsfr-data-a11y>