République
française
dsfr-data
Documentation — Web Components DSFR pour la dataviz
Le composant <scatter-chart> visualise des correlations entre deux variables.
| Attribut | Type | Défaut | Description |
|---|---|---|---|
x | String (JSON) | — | Requis. Abscisses, tableau imbriqué : "[[10, 20, ...]]" (un sous-tableau par série) |
y | String (JSON) | — | Requis. Ordonnées, tableau imbriqué : "[[25, 35, ...]]" |
x-min / x-max / y-min / y-max | Number | "" | Bornes des axes |
name | String (JSON) | "" | Noms des séries : '["Série 1"]' |
selected-palette | String | "" | Palette DSFR Chart : default, categorical, sequentialAscending, sequentialDescending, divergentAscending, divergentDescending, neutral |
unit-tooltip | String | "" | Unité affichée dans les tooltips |
show-line | Boolean | false | Relie les points par une ligne |
vline / vlinecolor / vlinename | String | "" | Repère vertical (valeur, couleur, libellé) |
hline / hlinecolor / hlinename | String | "" | Repère horizontal (valeur, couleur, libellé) |
date | String | "" | Date de la donnée (mention sous le graphique) |
aspect-ratio | Number | 2 | Ratio largeur/hauteur du canvas |
<scatter-chart x="[[10, 20, 30, 40, 50, 60, 70, 80]]" y="[[25, 35, 20, 45, 30, 55, 40, 60]]" selected-palette="categorical"> </scatter-chart>
Exemple montrant la correlation entre les scores RGAA et DSFR des sites gouvernementaux.
<scatter-chart x="[[65, 72, 91, 68, 83, 95, 76, 89, 79, 65, 81, 74, 58, 82, 77]]" y="[[71, 85, 95, 78, 88, 97, 82, 91, 84, 71, 86, 79, 65, 87, 83]]" selected-palette="default"> </scatter-chart>