Le composant <gauge-chart> affiche une progression vers un objectif.

Attributs

AttributTypeDéfautDescription
initNumber—Requis. Valeur de départ de la jauge
targetNumber—Requis. Valeur cible (100 % de la jauge)
percentNumbernullPourcentage de progression affiché directement (0-100). S'il est absent, il est calculé depuis value, init et target
valueNumber0Valeur courante — utilisée pour calculer le pourcentage quand percent n'est pas fourni
init-date / target-dateString""Dates associées aux bornes (affichées dans la légende)
heightString"2rem"Hauteur de la barre de jauge
legendBooleantrueAffiche la légende (bornes et progression)

Via dsfr-data-chart type="gauge", l'attribut gauge-value (ou le premier enregistrement de la source) est converti en percent, avec init="0" et target="100".

Exemples de jauges

Score RGAA

Conformite DSFR

Performance

<gauge-chart percent="82" init="0" target="100"></gauge-chart>

Differentes valeurs

25%

50%

75%

100%