Configuration

Defaults and partial updatesCopy Anchor Link

import { defineConfig, DEFAULT_CONFIG } from '@bloxwap/chart';

const config = defineConfig({
  series: { type: 'candlestick' },
  priceAxis: { mode: 'regular', autoScale: true },
  theme: { background: '#131722' },
});

chart.updateConfig({ grid: { visible: false } });

defineConfig type-checks and returns your partial; it does not fill in defaults. resolveConfig returns a full config merged over DEFAULT_CONFIG. The defaults exported by the package are the authoritative source for every value.

Nested objects merge recursively. Arrays and functions replace. undefined entries are ignored. Treat chart.getConfig() as read-only and mutate through updateConfig so changes render and caches stay valid.

Root fieldsCopy Anchor Link

SeriesCopy Anchor Link

Price axisCopy Anchor Link

priceAxis.labels contains lastPrice, highLow, indicator, and countdown (the bar-close countdown under the last-price badge). priceAxis.lines contains lastPrice, previousClose, and highLow. All start disabled. High/low references use the visible candle range.

Price transforms preserve raw data coordinates: yToPrice, drawing points, and candles continue to use actual prices even when the axis displays percentages.

Time axis and status lineCopy Anchor Link

timeAxis includes visible (true), height (24), tickCount (6), and intervalMs (null). intervalMs is the bar interval the countdown uses; null falls back to timeScale.intervalMs, then to the time between the last two candles.

statusLine includes visible (false), symbol ('Symbol'), symbolVisible, ohlc, change, volume, indicators, and countdown. All detail toggles except volume and countdown start enabled. The line follows the hovered candle or falls back to the latest candle. When the values don't fit the plot's width, as on a phone, they wrap onto more rows between values, keeping the countdown with the value before it, and the indicator rows move down. OHLC values take the candle's direction color, the change value takes the color of its sign, and both use the series up/down colors. Indicator values are labelled with a single-line study's short name or each line's style label, or with the line key in capitals for custom studies without style metadata.

See snapshots and countdown for the countdown and its ticker.

Time scaleCopy Anchor Link

See time scale for what continuous mode changes and what stays bar-indexed.

Indicator instancesCopy Anchor Link

Each entry of indicators is an IndicatorConfig:

Use chart.updateIndicator(id, patch) to change one. See indicators.

Volume overlayCopy Anchor Link

The overlay has its own vertical scale, so it never changes the price range. It is independent of the vol sub-pane indicator. On a Heikin Ashi series, bars take the Heikin Ashi direction.

Canvas stylingCopy Anchor Link

Crosshair modes are cross, dot, arrow, and demonstration. labelColor: 'auto' chooses black or white for contrast. An empty watermark font family inherits the theme font.

theme.borderColor paints the separators between panes. theme.scaleFontSize (null) and theme.scaleFontFamily ('') set the price and time scale text; they follow fontSize and monoFamily when unset. See theming and presets.

PresetsCopy Anchor Link

createChart({ preset }) layers a named preset or any partial under theme and config. CHART_PRESETS holds the built-in presets, currently bloxwapDark. withPreset(preset, partial) layers them in your own code, and presetChartTheme(preset) keeps a preset's colors when the toolbar switches themes. See theming and presets.

For browser UI controls over these fields, see toolbar and settings.