This
JavaScript Stock Chart
example demonstrates a
real-time candlestick chart driven by continuously
updated local data. The chart starts with 120 simulated one-minute
OHLCV candles and then dynamically updates the active candle or
appends a new candle using series.setData() and
series.addPoint().
In this example, the chart uses a plain in-memory array as its data source, so no network request is required. A timer simulates a real-time stock data stream by generating frequent price updates for one-minute OHLCV candles. Each generated record is processed in one of the following ways: When the generated record has the same timestamp as the latest candle, the existing candle is updated using series.setData(candle, 0). Animation is disabled for this operation because updates occur frequently. When the generated record has a newer timestamp, a new one-minute candlestick is appended using series.addPoint(candle, 100) with a short animation. The open, high, low, close, and volume values shown above the chart represent the latest simulated candle. The values are refreshed whenever the local data stream updates the active candle or adds a new one. You can replace the simulated data returned by createInitialLocalData() with data from an API, WebSocket, or another local data source. The same update logic can be used to build real-time stock market visualizations, financial dashboards, and live trading charts. More information about configuring the Stock Chart component is available in the Stock Chart documentation .