Docs / Area charts

Negative values

Pro

An area chart whose line and fill are coloured differently above and below zero.

Illustration — rendered output uses live data.

Example

blade 
<chart:area-negative
    :series="[['name' => 'Net', 'data' => [5, -3, 8, -6, 2]]]"
    :categories="['Jan', 'Feb', 'Mar', 'Apr', 'May']"
/>

Props

Prop Type Default Description
series array [] Series objects or a flat list of numbers.
categories array [] Labels for the x-axis.
positiveColor string #22c55e Colour above zero.
negativeColor string #ef4444 Colour below zero.

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 Missing points →