An OHLC Series shows open and close data with horizontal tick lines, and high and low ranges with a vertical line.
Simple OHLC
To create an OHLC Series, use the ohlc series type.
series: [
{
type: 'ohlc',
xKey: 'date',
lowKey: 'low',
openKey: 'open',
closeKey: 'close',
highKey: 'high',
},
],
In this configuration:
xKeysets the ohlc's x value.lowKeymaps to the low/min value.openKeymaps to the open value.closeKeymaps to the close value.highKeymaps to the high/max value.
Customisation
Series items are customised via the item configuration object.
Data items with a closing value higher than the opening value are considered as up, and those with a closing value lower than the opening value are down.
The properties item.up and item.down control the display of rising and falling series items.
series: [
{
type: 'ohlc',
// ...
item: {
up: {
stroke: '#45ba45',
strokeWidth: 2,
},
down: {
stroke: '#ba4545',
strokeWidth: 2,
},
},
},
],
API Reference
Properties available on the AgOhlcSeriesOptions interface.
Function used to return formatting for individual items, based on the given parameters. If the current datum is highlighted, the highlighted property will be set to true; make sure to check this if you want to differentiate between the highlighted and un-highlighted states.
Primary identifier for the series. This is provided as seriesId in user callbacks to differentiate multiple series. Auto-generated ids are subject to future change without warning, if your callbacks need to vary behaviour by series please supply your own unique id value.
The data to use when rendering the series. If this is not supplied, data must be set on the chart instead.
Configuration for marker and series highlighting when a series or legend item is hovered over.
A human-readable description of open values. If supplied, this will be shown in the default tooltip and passed to the tooltip renderer as one of the parameters.
A human-readable description of close values. If supplied, this will be shown in the default tooltip and passed to the tooltip renderer as one of the parameters.
A human-readable description of high values. If supplied, this will be shown in the default tooltip and passed to the tooltip renderer as one of the parameters.
A human-readable description of low values. If supplied, this will be shown in the default tooltip and passed to the tooltip renderer as one of the parameters.