Stacked area
Sum and percent stacks with original values in every readout.
ChartPlot stackAreaLine
Use ChartPlot stack with the same Area and Lineprimitives. Descriptor order defines the layers from bottom to top. Stacked series must share a unit and curve. The scale includes zero and stays stable through legend toggles; data updates animate both boundaries and scale together.
Visible contributions share cumulative boundaries, inspection and one interruptible visibility transition. Tooltip values remain the original contributions; the total is calculated from visible series. A missing visible contribution leaves a gap across the stack and marks the total incomplete. Hide that series to inspect the remaining known total. The default sum mode stacks positive values above zero and negative values below it. stack="percent" normalizes visible non-negative contributions to a 0–100% scale without changing raw tooltip values. Mismatched curves produce a specific error.
TypeScript
<ChartPlot stack height={300} tooltip={<Tooltip />}>
<Grid pattern="dots" />
<Area series="direct" />
<Area series="organic" />
<Line series="direct" />
<Line series="organic" />
<XAxis /><YAxis showTicks={false} />
</ChartPlot>
<Legend interactive />