Line Chart - DSFR Chart

Le composant <line-chart> permet de visualiser des tendances et evolutions dans le temps.

Attributs

Attribut	Type	Description
`x`	String	Valeurs axe X en JSON : `'[[1, 2, 3]]'`
`y`	String	Valeurs axe Y en JSON : `'[[10, 20, 30]]'`
`selected-palette`	String	Palette de couleurs
`unit-tooltip`	String	Unite dans les tooltips
`x-min / x-max`	Number	Limites axe X
`y-min / y-max`	Number	Limites axe Y

Exemples

1. Ligne simple

<line-chart
  x="[[2020, 2021, 2022, 2023, 2024]]"
  y="[[65, 72, 78, 85, 91]]"
  selected-palette="default"
  unit-tooltip="%">
</line-chart>

2. Multi-series

<line-chart
  x="[[2020, 2021, 2022, 2023], [2020, 2021, 2022, 2023]]"
  y="[[65, 72, 78, 85], [70, 75, 82, 88]]"
  selected-palette="categorical">
</line-chart>

3. Palette divergente

<line-chart
  x="[[1, 2, 3, 4, 5, 6]]"
  y="[[10, 25, 15, 30, 20, 35]]"
  selected-palette="divergentAscending">
</line-chart>