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:
xKey
sets the ohlc's x value.lowKey
maps to the low/min value.openKey
maps to the open value.closeKey
maps to the close value.highKey
maps 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.