Interface: LineChartOptions<TXAxisOptions, TYAxisOptions>
Type parameters
| Name | Type |
|---|---|
TXAxisOptions | AxisOptions |
TYAxisOptions | TXAxisOptions |
Hierarchy
Options<TXAxisOptions,TYAxisOptions>↳
LineChartOptions
Properties
classNames
• Optional classNames: Object
Override the class names that get used to generate the SVG structure of the chart
Type declaration
| Name | Type |
|---|---|
chart? | string |
label? | string |
labelGroup? | string |
series? | string |
line? | string |
point? | string |
area? | string |
grid? | string |
gridGroup? | string |
gridBackground? | string |
vertical? | string |
horizontal? | string |
start? | string |
end? | string |
Overrides
Defined in
charts/LineChart/LineChart.types.ts:32
showLine
• Optional showLine: boolean
If the line should be drawn or not
Defined in
charts/LineChart/LineChart.types.ts:51
showPoint
• Optional showPoint: boolean
If dots should be drawn or not
Defined in
charts/LineChart/LineChart.types.ts:55
showArea
• Optional showArea: boolean
If the line chart should draw an area
Defined in
charts/LineChart/LineChart.types.ts:59
areaBase
• Optional areaBase: number
The base for the area chart that will be used to close the area shape (is normally 0)
Defined in
charts/LineChart/LineChart.types.ts:63
lineSmooth
• Optional lineSmooth: boolean | LineInterpolation
Specify if the lines should be smoothed. This value can be true or false where true will result in smoothing using the default smoothing interpolation function Chartist.Interpolation.cardinal and false results in Chartist.Interpolation.none. You can also choose other smoothing / interpolation functions available in the Chartist.Interpolation module, or write your own interpolation function. Check the examples for a brief description.
Defined in
charts/LineChart/LineChart.types.ts:70
showGridBackground
• Optional showGridBackground: boolean
If the line chart should add a background fill to the .ct-grids group.
Defined in
charts/LineChart/LineChart.types.ts:74
fullWidth
• Optional fullWidth: boolean
When set to true, the last grid line on the x-axis is not drawn and the chart elements will expand to the full available width of the chart. For the last label to be drawn correctly you might need to add chart padding or offset the last label with a draw event handler.
Defined in
charts/LineChart/LineChart.types.ts:78
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/LineChart/LineChart.types.ts:82
series
• Optional series: Record<string, Omit<LineChartOptions<TXAxisOptions, TYAxisOptions>, "series">>
Defined in
charts/LineChart/LineChart.types.ts:83
width
• Optional width: string | number
Specify a fixed width for the chart as a string (i.e. '100px' or '50%')
Inherited from
Defined in
height
• Optional height: string | number
Specify a fixed height for the chart as a string (i.e. '100px' or '50%')
Inherited from
Defined in
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
Defined in
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
Defined in
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
Defined in
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
Defined in
axisX
• Optional axisX: TXAxisOptions
Options for X-Axis
Inherited from
Defined in
axisY
• Optional axisY: TYAxisOptions
Options for Y-Axis
Inherited from
Defined in
plugins
• Optional plugins: (Plugin | [Plugin, any])[]
Inherited from
Defined in
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.