Interface AreaChartProps<S, VS>

The series' semantic identifier — what the data is / how it should read (e.g. elevation, or a signed-traffic role like in / out). The theme maps it to an AreaStyle (theme.area[as] ?? theme.area.default) — outline colour/width + the graded fill. Omitted ⇒ the default style; there's no per-component colour/style override (restyle via the theme, the single styling channel).

Which <YAxis> (by its id) this area scales against — picks the scale, where as picks the style. Omitted ⇒ the row's default axis.

The value the fill rests on — the flat edge opposite the value line. Two forms:

• Omitted ⇒ the axis's lower bound (the bottom of the plot): the elevation form — fill from the line down to the floor, shade grading down.
• A number (e.g. 0) ⇒ a fixed baseline: the above/below-axis form — values above it fill up, below it fill down, each side's shade fading toward the baseline. For the esnet two-colour traffic look, compose two <AreaChart>s (an "in" column and an "out" column, distinct as roles).

A fixed baseline is pulled into the auto-fit domain so the baseline line is always visible (an above/below area with baseline={0} shows the zero axis).

Name of the numeric value column to fill from.

Render-time path interpolation for the outline + fill edge — a view concern (denoise the data with pond's smooth() upstream). Omitted ⇒ 'linear' (straight segments). 'monotone' is a smooth edge that still passes through points.

How a gap (a coast / dropout — a run of NaN in column) is rendered (a GapMode). Omitted ⇒ 'empty': the fill and outline break at the gap, leaving a hole (the honest default). 'none' fills + bridges straight across. For 'dashed' / 'step' / 'fade' the fill stays broken and only the outline gets the inferred connector across the gap — a faint dashed straight bridge, a faint flat dashed line at the average of the edge values, or estela's fade-to-baseline (which drops to this area's own baseline, the fill floor). Shared with <LineChart> — one concept. (The 'dashed' / 'step' connector faintness is the theme's gap.connectorOpacity.)

Declaration position among the <Layers> children, injected by Layers so z-order follows JSX order. Do not set.

The source series. A TimeSeries fills against the time axis; a ValueSeries (series.byValue('dist')) against its value axis — the container infers which from the data, no axis-type prop (mirrors <LineChart>). Either way column names the numeric value to fill from.

Live charts: series.byValue(…) mints a fresh projection each call, so an inline series={s.byValue('dist')} re-registers this layer every render — on a frequently re-rendering chart, memoize the projection (useMemo).