Docs / Area charts

Fan chart

Pro

A central line surrounded by nested confidence bands — ideal for forecasts with uncertainty.

Illustration — rendered output uses live data.

Example

blade 
<chart:area-fan
    :categories="['Now', '+1', '+2', '+3']"
    :line="[10, 11, 12, 13]"
    :bands="[
        ['low' => [8, 6, 4, 2], 'high' => [12, 16, 20, 24]],
        ['low' => [9, 8, 7, 6], 'high' => [11, 14, 17, 20]],
    ]"
/>

Props

Prop Type Default Description
categories array [] Labels for the x-axis.
line array [] The central (median) values.
bands array [] Nested bands as [low, high].

Plus the common props (height, theme, model, class).

This is a Pro component

Unlock it and every other Pro chart with a one-time license.

Get WireCharts Pro
Next Area race →