An area draw layer: fills between a value column and a baseline, with a
graded (gradient) shade — opaque at the line, transparent at the baseline —
and an outline stroke on top. Reads column into a ChartSeries
(columnar, gaps as NaN), registers into the enclosing Layers (scaling
against its axis), and renders nothing to the DOM — the row draws it. The
fill + outline break at gaps rather than spanning them.
Two forms via baseline (see AreaChartProps.baseline): omit it for
the elevation form (rest on the axis floor) or pass 0 for the
above/below-axis form (positive up, negative down). The esnet two-colour
traffic look composes two layers, each with its own as role:
<Layers>
<AreaChart series={s} column="in" baseline={0} as="in" />
<AreaChart series={s} column="out" baseline={0} as="out" />
</Layers>