This React Stock Chart example visualizes the AAPL stock price with candle chart. Tooltip and crosshair show the information about the data and period.
In this example, you can see how to render and configure the stock chart. The candle type series chart shows financial data and trends at equal intervals. The Period Selector and Range Selector can be used to select a range with specified periods.
Stock Chart provides support to 10 types of Technical Indicators namely Accumulation Distribution, ATR, EMA, SMA, TMA, Momentum, MACD, RSI, Stochastic, Bollinger Band. By using indicator dropdown box, add and remove the required indicator types.
Tooltip is enabled in this example. To see the tooltip in action, hover the chart or tap on it in touch enabled devices.
Injecting Module
The Stock chart component features are segregated into individual feature-wise modules. To use date-time axis,
inject the
DateTime module using the
StockChart.Inject(DateTime) method. To use the LineSeries, inject the
CandleSeries module using the
StockChart.Inject(CandleSeries) method.
More information about the stock charts can be found in this documentation section.