# `PhiaUi.Components.RidgelineChart`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/data/ridgeline_chart.ex#L1)

Ridgeline chart (joy plot) — pure SVG, zero JS.

Renders multiple overlapping density distributions stacked vertically.
Each row shows a Gaussian KDE of the given values. Useful for comparing
distributions across categories.

## Examples

    <.ridgeline_chart data={[
      %{label: "Group A", values: [1, 2, 3, 3, 4, 5, 5, 5, 6, 7]},
      %{label: "Group B", values: [3, 4, 5, 5, 6, 7, 7, 8, 9, 10]},
      %{label: "Group C", values: [0, 1, 1, 2, 2, 3, 4, 5, 6, 8]}
    ]} />

    <.ridgeline_chart
      data={[%{label: "2024", values: [...]}, %{label: "2025", values: [...]}]}
      overlap={0.6}
      fill_opacity={0.5}
    />

# `ridgeline_chart`

## Attributes

* `data` (`:list`) - Distribution data: `[%{label, values: [numbers]}]`. Defaults to `[]`.
* `colors` (`:list`) - Override default palette. CSS color strings. Defaults to `[]`.
* `overlap` (`:float`) - Overlap factor between distributions (0-1). Defaults to `0.5`.
* `fill_opacity` (`:float`) - Fill opacity for density areas. Defaults to `0.6`.
* `resolution` (`:integer`) - Number of KDE evaluation points. Defaults to `50`.
* `bandwidth` (`:any`) - KDE bandwidth (nil for Silverman's rule). Defaults to `nil`.
* `animate` (`:boolean`) - Enable entrance animations. Defaults to `true`.
* `animation_duration` (`:integer`) - Animation duration in ms. Defaults to `800`.
* `show_labels` (`:boolean`) - Show row labels. Defaults to `true`.
* `theme` (`:map`) - Chart theme overrides (see ChartTheme). Defaults to `%{}`.
* `id` (`:string`) - Unique ID for the chart (auto-generated if not provided). Defaults to `nil`.
* `title` (`:string`) - Chart title rendered above the visualization. Defaults to `nil`.
* `description` (`:string`) - Chart description for context (rendered below title). Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.
* Global attributes are accepted.

---

*Consult [api-reference.md](api-reference.md) for complete listing*