Skip to content

Documentation / @ripl/charts / ChartLayout

Class: ChartLayout ​

Defined in: charts/src/core/layout.ts:124

Tracks the remaining free space within a chart and allows components to reserve bands from any edge. The order of reservation determines stacking: bands reserved first sit furthest from the plot area.

Every reservation accepts a gap — space consumed beyond the returned band, separating it from whatever is reserved next. Without one, adjacent elements (a title and the legend below it, a legend and the plot) sit flush against each other. Callers should pass a step from SPACING rather than a bare number; ELEMENT_GAP is the default separation between two distinct chart elements.

Constructors ​

Constructor ​

new ChartLayout(width, height, padding): ChartLayout

Defined in: charts/src/core/layout.ts:131

Parameters ​

ParameterType
widthnumber
heightnumber
paddingChartPadding

Returns ​

ChartLayout

Accessors ​

area ​

Get Signature ​

get area(): ChartArea

Defined in: charts/src/core/layout.ts:139

The remaining free area after all reservations so far.

Returns ​

ChartArea

Methods ​

reserve() ​

reserve(side, amount, gap?): ChartArea

Defined in: charts/src/core/layout.ts:232

Reserves a band from the given side. Horizontal sides consume width, vertical sides consume height.

Parameters ​

ParameterTypeDefault valueDescription
sideChartSideundefinedThe edge to reserve from.
amountnumberundefinedThickness of the band, in pixels.
gapnumber0Extra space consumed after the band, separating it from the next reservation.

Returns ​

ChartArea


reserveBottom() ​

reserveBottom(amount, gap?): ChartArea

Defined in: charts/src/core/layout.ts:172

Reserves a band of the given thickness from the bottom edge and returns it.

Parameters ​

ParameterTypeDefault valueDescription
amountnumberundefinedThickness of the band, in pixels.
gapnumber0Extra space consumed after the band, separating it from the next reservation.

Returns ​

ChartArea


reserveLeft() ​

reserveLeft(amount, gap?): ChartArea

Defined in: charts/src/core/layout.ts:192

Reserves a band of the given thickness from the left edge and returns it.

Parameters ​

ParameterTypeDefault valueDescription
amountnumberundefinedThickness of the band, in pixels.
gapnumber0Extra space consumed after the band, separating it from the next reservation.

Returns ​

ChartArea


reserveRight() ​

reserveRight(amount, gap?): ChartArea

Defined in: charts/src/core/layout.ts:210

Reserves a band of the given thickness from the right edge and returns it.

Parameters ​

ParameterTypeDefault valueDescription
amountnumberundefinedThickness of the band, in pixels.
gapnumber0Extra space consumed after the band, separating it from the next reservation.

Returns ​

ChartArea


reserveTop() ​

reserveTop(amount, gap?): ChartArea

Defined in: charts/src/core/layout.ts:154

Reserves a band of the given thickness from the top edge and returns it.

Parameters ​

ParameterTypeDefault valueDescription
amountnumberundefinedThickness of the band, in pixels.
gapnumber0Extra space consumed after the band, separating it from the next reservation.

Returns ​

ChartArea