Chart Types
ApexStock renders the same OHLC series in several styles. A chart-type switcher in the toolbar lets the viewer move between them at runtime, and each type is derived from the same [open, high, low, close] candles you supply.
Available types
| Type | Description |
|---|---|
| Candlestick | The default. Body spans open-to-close, wicks span high-to-low. |
| Bar (OHLC) | Open/close ticks on a vertical high-low bar. |
| Line | A single line through the close price of each bar. |
| Area | The close-price line with a filled area beneath it. |
| Heikin-Ashi | Smoothed candles computed from the raw OHLC to filter noise and highlight trend. |
| Renko | Price-movement bricks that ignore time, plotted only when price moves by a set brick size. |
Candlestick is the initial type; the others are reached through the switcher.
The chart-type switcher
The switcher renders in the chart's primary toolbar. No configuration is needed: it is available as soon as the chart renders, and switching preserves the current zoom window, theme, and any active indicators or trading overlays.
const apexStock = new ApexStock(document.querySelector('#chart'), {
chart: { height: 500 },
series: [{ name: 'ACME', data: candles }],
theme: { mode: 'light' },
})
apexStock.render()
// The toolbar now shows the chart-type dropdown alongside indicators and export.
Derived types
Heikin-Ashi and Renko are computed from your candles, so no extra data is required:
- Heikin-Ashi recalculates each candle from the previous Heikin-Ashi values, producing smoother bodies that make trends easier to read. It keeps one candle per original bar, so the time axis is unchanged.
- Renko converts the series into bricks sized as a percentage of price. Because Renko is movement-based rather than time-based, the switcher exposes a brick-size setting so you can tune sensitivity. The transformed series preserves the original timestamps.
Tooltips across types
Box-style types (candlestick, Heikin-Ashi, Renko) show an OHLC breakdown on hover; line and area show the close value. The tooltip adapts automatically to the active type, so you do not need to configure it per type.
Theming the series
Chart-type styling (candle up/down colors, line color, area fill) is standard ApexCharts styling: set it through plotOptions.candlestick.colors, per-series colors, and theme.mode. The surrounding ApexStock UI (toolbar, dropdowns) is themed separately, see Theming.