Skip to main content

Interface: BarChartOptions<TXAxisOptions, TYAxisOptions>

Type parameters​

NameType
TXAxisOptionsAxisOptions
TYAxisOptionsTXAxisOptions

Hierarchy​

  • Options<TXAxisOptions, TYAxisOptions>

    ↳ BarChartOptions

Properties​

classNames​

• Optional classNames: Object

Override the class names that get used to generate the SVG structure of the chart

Type declaration​

NameType
chart?string
horizontalBars?string
label?string
labelGroup?string
series?string
bar?string
grid?string
gridGroup?string
gridBackground?string
vertical?string
horizontal?string
start?string
end?string

Overrides​

Options.classNames

Defined in​

charts/BarChart/BarChart.types.ts:22


seriesBarDistance​

• Optional seriesBarDistance: number

Specify the distance in pixel of bars in a group

Defined in​

charts/BarChart/BarChart.types.ts:40


stackBars​

• Optional stackBars: boolean

If set to true this property will cause the series bars to be stacked. Check the stackMode option for further stacking options.

Defined in​

charts/BarChart/BarChart.types.ts:44


stackMode​

• Optional stackMode: boolean | "accumulate" | "accumulate-relative"

If set to true this property will force the stacked bars to draw from the zero line. If set to 'accumulate' this property will form a total for each series point. This will also influence the y-axis and the overall bounds of the chart. In stacked mode the seriesBarDistance property will have no effect. If set to 'accumulate-relative' positive and negative values will be handled separately.

Defined in​

charts/BarChart/BarChart.types.ts:50


horizontalBars​

• Optional horizontalBars: boolean

Inverts the axes of the bar chart in order to draw a horizontal bar chart. Be aware that you also need to invert your axis settings as the Y Axis will now display the labels and the X Axis the values.

Defined in​

charts/BarChart/BarChart.types.ts:54


distributeSeries​

• Optional distributeSeries: boolean

If set to true then each bar will represent a series and the data array is expected to be a one dimensional array of data values rather than a series array of series. This is useful if the bar chart should represent a profile rather than some data over time.

Defined in​

charts/BarChart/BarChart.types.ts:58


reverseData​

• Optional reverseData: boolean

If true the whole data is reversed including labels, the series order as well as the whole series data arrays.

Defined in​

charts/BarChart/BarChart.types.ts:62


showGridBackground​

• Optional showGridBackground: boolean

If the bar chart should add a background fill to the .ct-grids group.

Defined in​

charts/BarChart/BarChart.types.ts:66


width​

• Optional width: string | number

Specify a fixed width for the chart as a string (i.e. '100px' or '50%')

Inherited from​

Options.width

Defined in​

core/types.ts:40


height​

• Optional height: string | number

Specify a fixed height for the chart as a string (i.e. '100px' or '50%')

Inherited from​

Options.height

Defined in​

core/types.ts:44


low​

• Optional low: number

Overriding the natural low of the chart allows you to zoom in or limit the charts lowest displayed value

Inherited from​

Options.low

Defined in​

core/types.ts:48


high​

• Optional high: number

Overriding the natural high of the chart allows you to zoom in or limit the charts highest displayed value

Inherited from​

Options.high

Defined in​

core/types.ts:52


referenceValue​

• Optional referenceValue: number

Unless low/high are explicitly set, bar chart will be centered at zero by default. Set referenceValue to null to auto scale.

Inherited from​

Options.referenceValue

Defined in​

core/types.ts:56


chartPadding​

• Optional chartPadding: number | Partial<ChartPadding>

Padding of the chart drawing area to the container element and labels as a number or padding object.

Inherited from​

Options.chartPadding

Defined in​

core/types.ts:60


axisX​

• Optional axisX: TXAxisOptions

Options for X-Axis

Inherited from​

Options.axisX

Defined in​

core/types.ts:64


axisY​

• Optional axisY: TYAxisOptions

Options for Y-Axis

Inherited from​

Options.axisY

Defined in​

core/types.ts:68


plugins​

• Optional plugins: (Plugin | [Plugin, any])[]

Inherited from​

Options.plugins

Defined in​

core/types.ts:74


viewBox​

• Optional viewBox: ViewBox

Define the ViewBox for an SVG, this is optional and only required if you need a scalable chart. This should be used together with responsive options to ensure a proper text size.

Inherited from​

Options.viewBox

Defined in​

core/types.ts:78