in packages/charts/src/chart_types/xy_chart/rendering/area.ts [27:107]
export function renderArea(
shift: number,
dataSeries: DataSeries,
xScale: ScaleBand | ScaleContinuous,
yScale: ScaleContinuous,
panel: Dimensions,
color: Color,
curve: CurveType,
isBandedSpec: boolean,
xScaleOffset: number,
style: AreaSeriesStyle,
markSizeOptions: MarkSizeOptions,
isStacked: boolean,
hasFit: boolean,
pointStyleAccessor?: PointStyleAccessor,
): {
areaGeometry: AreaGeometry;
indexedGeometryMap: IndexedGeometryMap;
} {
const y1Fn = getY1ScaledValueFn(yScale);
const y0Fn = getY0ScaledValueFn(yScale);
const definedFn = isYValueDefinedFn(yScale, xScale);
const y1DatumAccessor = getYDatumValueFn();
const y0DatumAccessor = getYDatumValueFn('y0');
const pathGenerator = area<DataSeriesDatum>()
.x(({ x }) => xScale.scale(x) - xScaleOffset)
.y1(y1Fn)
.y0(y0Fn)
.defined((datum) => {
return definedFn(datum, y1DatumAccessor) && (isBandedSpec ? definedFn(datum, y0DatumAccessor) : true);
})
.curve(getCurveFactory(curve));
// TODO we can probably avoid this function call if no fit function is applied.
const clippedRanges = getClippedRanges(dataSeries.data, xScale, xScaleOffset);
const lines: string[] = [];
const y0Line = isBandedSpec && pathGenerator.lineY0()(dataSeries.data);
const y1Line = pathGenerator.lineY1()(dataSeries.data);
if (y1Line) lines.push(y1Line);
if (y0Line) lines.push(y0Line);
const { pointGeometries, indexedGeometryMap, minDistanceBetweenPoints } = renderPoints(
shift - xScaleOffset,
dataSeries,
xScale,
yScale,
panel,
color,
style.point,
style.isolatedPoint,
style.line.strokeWidth,
isBandedSpec,
markSizeOptions,
false,
style.isolatedPoint.enabled,
pointStyleAccessor,
);
const areaGeometry: AreaGeometry = {
area: pathGenerator(dataSeries.data) || '',
lines,
points: pointGeometries,
color,
transform: {
y: 0,
x: shift,
},
seriesIdentifier: getSeriesIdentifierFromDataSeries(dataSeries),
style,
isStacked,
clippedRanges,
shouldClip: hasFit,
hasFit,
minPointDistance: minDistanceBetweenPoints,
};
return {
areaGeometry,
indexedGeometryMap,
};
}