Extended Hours
Extended hours is a part of ChartReactConfig and also a dxcharts-react
setting, which allows to configure which sessions data should be displayed on chart.
Important note: both chartDataProvider and TradingSessionsProvider should be implemented to support this feature completely. chartDataProvider is mandatory since dxcharts-react expects to receive additional candles to display them. TradingSessionsProvider is optional to highlight the pre and post market sessions candles which chartDataProvider generated before
When extendedHours
property is enabled
two things happen:
- chartDataProvider method
requestHistoryData
will be called withextendedHours
optiontrue
value:
chartDataProvider.requestHistoryData('AAPL', '1h', { extendedHours: true }).
In return dxcharts-react
will expect candles from all trading sessions: 'REGULAR', PRE_MARKET', 'POST_MARKET' and NO_TRADING and redraw chart after the data is received with all trading sessions data.
- TradingSessionsProvider allows to differentiate which candles data belongs to which trading session, it's method
generateSessions
takesfrom
andto
timestamps and also instrument's name and it's trading hours. After that it generates corresponding to this time sessions, which are used to highlight pre and post market sessions candles:
tradingSessionsProvider.generateSessions(1718913600000, 1727870571446,
{ symbol: 'AAPL', tradingHours: 'NewYorkETH()' }),
As the result additional trading sessions candles are displayed and highlighed on the chart:

Session Breaks
TradingSessionsProvider should be implemented to support this feature
When sessionBreaks
is enabled
vertical lines appear on chart that indicate the start and the end of different trading sessions. To know where to draw a line, dxcharts-react receives trading sessions schedule via tradingSessionsProvider.generateSessions
the same way extended hours do: