Hopp til innholdet
DIAGRAMMER · COMPLETE

AreaChart

Vis totaler og andeler med et blikk med stablede, prosentvise eller overlappende områder.

Vis summer og andeler med et blikk med stablede, prosentvise eller overlappende områder.

Hvorfor det hjelper

  • Stablet, prosentvis eller overlagret
  • Lettleste summer
  • Klikkbar forklaring

Hvor det passer

  • Sammensetning over tid
  • Kumulative verdier
  • Markedsandel
Kontrollen AreaChart på en RayCraft-side

Eksempel

<Select TValue="AreaMode" @bind-Value="_mode" Items="_modes" Label="Mode" />
<AreaChart Label="Visits by channel" Mode="_mode" Categories="_months" Series="_series" ValueFormat="#,0" />

@code {
    private AreaMode _mode = AreaMode.Stacked;
    private readonly AreaMode[] _modes = [AreaMode.Stacked, AreaMode.Percent, AreaMode.Overlay];
    private readonly string[] _months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug"];
    private readonly ChartSeries[] _series =
    [
        new("Search", [320, 340, 390, 420, 410, 470, 520, 540]),
        new("Direct", [210, 220, 215, 240, 260, 255, 280, 300]),
        new("Social", [90, 120, 160, 150, 210, 230, 220, 260]),
        new("Email", [60, 55, 70, 80, 75, 95, 100, 120])
    ];
}

Et kort utdrag. Legg til @using RayCraft.Blazor.Components på siden din, og bruk en interaktiv gjengivelsesmodus.

Del av RayCraft Complete.

Alle kontroller ยท Dokumentasjon