Reference
Objects
Every structure that crosses the boundary, in both directions: what your datafeed returns, and what you pass to a chart method. Field by field, with the units.
Two directions
Worth separating before anything else, because the same word means different things depending on which way it is travelling.
| Family | Direction | Objects |
|---|---|---|
| Datafeed shapes | you → chart | Bar, SymbolInfo, SearchItem |
| Chart objects | you → chart | OrderLine, PositionLine, ExecutionShape |
The two units that trip everyone
bar.time is milliseconds. period.from, period.to and every visible range are seconds. Inherited from the contract this mirrors, and the single commonest mistake in the whole integration. It fails as a chart that draws nothing in the window it asked about, which looks exactly like having no data for that symbol.Bar
What getBars resolves to, as an array, ASCENDING by time with no duplicates. That is checked rather than assumed: every engine requires it, no backend guarantees it, and the failure is silent, a descending page renders with its x-axis running backwards inside one request and forwards across requests.
| Field | Type | Default | Meaning |
|---|---|---|---|
time | number | required | Milliseconds since the epoch, while from and to in the request are seconds. Inherited from the contract this mirrors, and the commonest connection mistake: it fails as a chart that draws nothing in the window it just asked about. |
open | number | required | Must be finite. One NaN scales the whole visible range and empties the chart. |
high | number | required | Must be finite. |
low | number | required | Must be finite. |
close | number | required | Must be finite. |
volume | number | – | Omit it rather than sending 0. A volume pane of zeroes is a claim that nothing traded. |
levels | FootprintLevel[] | – | Order flow per price level, { price, bid, ask } ascending by price, read by the footprint chart type only. ABSENT is not EMPTY: absent means you supplied no order flow for this bar and the chart draws an empty column, never a distribution invented from the candle; [] means you did and nothing traded. |
levelStep | number | – | The price step the levels sit on. Positive. Absent, the chart uses the symbol’s tick, then the spacing of the levels themselves. |
footprintSource | string | – | exchange_trades, sub_candles or synthetic. Anything below exchange_trades is drawn with a quality ring. Absent: exchange_trades when levels is present. |
NaN high or an accidental null close empties the chart. Every field is validated, and the refusal names the index.footprint chart type only, and on them ABSENT is not EMPTY: a bar with no levels is one you supplied no order flow for, drawn as an empty column; a bar with levels: [] is one where nothing traded. The chart never fills the first in from the candle.Trade
What subscribeTrades pushes: one print, folded into the forming bar's levels by the bar its timestamp falls in. Only a footprint chart subscribes.
| Field | Type | Default | Meaning |
|---|---|---|---|
price | number | required | Must be finite. |
size | number | required | Traded quantity. Finite and not negative. |
side | 'buy' | 'sell' | required | The AGGRESSOR: buy lifted the offer and counts as ask, sell hit the bid and counts as bid. |
timestamp | number | required | Milliseconds since the epoch. Decides which bar the print is folded into. |
FootprintSlice
What getFootprint resolves to, as an array, one per bar in the window. levels is required here where it is optional on a bar, because a slice always speaks for its bar.
| Field | Type | Default | Meaning |
|---|---|---|---|
time | number | required | The bar’s opening time in MILLISECONDS. Must match a bar the chart holds, or the slice lands nowhere. |
levels | FootprintLevel[] | required | Required, unlike on a bar: a slice always speaks for its bar, and [] says nothing traded. |
levelStep | number | – | As on a bar. |
footprintSource | string | – | As on a bar. |
SymbolInfo
What resolveSymbol resolves to. A deliberate SUBSET of what a full charting library accepts, these are the fields the embed actually reads, and documenting more would be documenting fields that do nothing.
| Field | Type | Default | Meaning |
|---|---|---|---|
name | string | required | What the chart shows as the instrument. The only required field. |
description | string | – | The longer name, shown beside it. |
type | string | – | stock · crypto · forex · index · futures. Drives nothing but the label. |
exchange | string | – | The venue. Shown in the legend, and compared against provider; see below. |
timezone | IANA name | Etc/UTC | Defaults to Etc/UTC. What the time axis is drawn in. |
session | string | 24x7 | Trading hours: 24x7, or 0930-1600. Defaults to 24x7, which draws no gaps. |
pricescale | number | 100 | 10^decimals, so 100 for two places. Zero or negative is REFUSED rather than defaulted: it decides where the decimal point goes on every price the reader sees, and a wrong price is worse than none. |
minmov | number | 1 | The smallest price step, usually 1. Positive or refused, same reasoning. |
has_intraday | boolean | true | Whether you serve resolutions below a day. False hides the intraday intervals. |
supported_resolutions | string[] | all | Which intervals you can answer for. Anything you leave out is not offered. |
volume_precision | number | 0 | Decimal places for volume. 0 for whole shares, more for a crypto pair. |
data_status | "streaming" | "endofday" | "delayed_streaming" | streaming | What the reader is told about freshness. ABSENT grades real-time, because every first-party feed omits it and defaulting to delayed would badge live charts with a louder lie. |
provider | string | – | Who SERVED the bars, when that is not the exchange. Set it only when they differ: a value repeating exchange is dropped rather than printed twice. It earns a "≈" glyph: live data that reached the reader through somebody other than the venue can disagree with the official print. |
delay | seconds | – | Publisher lag, when you know it. Absence renders as "the lag varies by exchange", never as zero, because claiming real-time on somebody else’s behalf is the one thing this field must never do. |
pricescale decides where the decimal point goes on every price the reader sees, so a zero or a negative is refused rather than defaulted, a wrong price is worse than no price. provider and delay are how a redistributed or delayed feed says so on the chart; absence renders as unknown, never as a confident zero.SearchItem
What searchSymbols resolves to. Optional, omit the method entirely and the chart's symbol search stays empty rather than erroring.
| Field | Type | Default | Meaning |
|---|---|---|---|
symbol | string | required | What the row shows. A row without it is dropped. |
description | string | – | The longer name, shown beneath. |
exchange | string | – | The venue badge on the row. |
type | string | – | Feeds the asset-class filter chips. |
ticker | string | symbol | What resolveSymbol will be called with, when that differs from what the row displays. Defaults to symbol. |
OrderLine
Passed to createOrderLine, and any subset of it to handle.set(). A price level in the scale rather than a drawing on top of it, so it moves with the chart and can be made draggable.
| Property | Type | Meaning |
|---|---|---|
price | number | Where the line sits, in the instrument’s own units. |
text | string | The label in the line’s body. Up to 200 characters. |
tooltip | string | Shown on hover, so detail that would crowd the label has somewhere to go. |
quantity | string | The badge at the end of the line. A string rather than a number, because it is a label: “2.5 BTC” and “50%” are both things a host needs to put there. |
lineColor | colour | The line itself. Hex or rgb(); url() is refused. |
lineWidth | pixels, 1–100 | Thickness. Zero and negative are refused. |
lineStyle | 0–4 | 0 solid · 1 dotted · 2 dashed · 3 large-dashed · 4 sparse-dotted. Anything else is refused. |
bodyAlignment | "left" | "right" | Defaults to right. Anchors the whole label, quantity and button group to the chosen plot edge. Position TP/SL, breakeven and drag-preview labels follow. Independent of lineLength and extendLeft. Set on creation or update with { bodyAlignment: "left" } to keep recent candles clear on narrow charts. |
bodyPaddingLeft | pixels, 0–100 | Inset from the left plot edge when bodyAlignment is left. Defaults to zero. Moves all controls and protection labels together; does not shorten the line. Available on creation and update. |
bodyPaddingRight | pixels, 0–100 | Right-aligned inset; default 0. |
bodyPaddingHorizontal | pixels, 0–100 | Padding on each side of body and quantity; default 6. |
bodyPaddingVertical | pixels, 0–100 | Padding above and below the row text; default 3. |
bodyBorderWidth | pixels, 0–100 | Control outline width; zero hides outlines; default 1. |
bodyBorderRadius | pixels, 0–100 or null | Body radius override; null inherits borderRadius. |
quantityBorderRadius | pixels, 0–100 or null | Quantity radius override; null inherits borderRadius. |
buttonBorderRadius | pixels, 0–100 or null | Action and drag-out button radius; null inherits borderRadius. |
buttonWidth | pixels, 0–100 | Minimum action button width; default 18. |
buttonIconWidth | pixels, 0–100 | Action icon stroke width; default 1.5. |
extendLeft | boolean | Draws the line across the full width rather than from the current bar rightward. |
lineLength | percent, 1–100 | How far left the line reaches, as a share of the plot. Only consulted when extendLeft is off, since a line pinned to the left edge already spans everything there is. |
borderRadius | pixels, 0–100 | The corner radius of every box on the line: the label body, the quantity chip and each button. Individual bodyBorderRadius, quantityBorderRadius and buttonBorderRadius overrides may be set; null restores this shared value. 0 is square; anything past half the row’s height is a full pill, the embed accepts 0–100. |
bodyBorderColor | colour | Outline of the label body. |
bodyBackgroundColor | colour | Fill behind the label text. |
bodyTextColor | colour | The label text. |
bodyFont | CSS font, ≤120 chars | The label’s font, as a CSS shorthand: bold 12px "Inter", system-ui, sans-serif. url() is refused, for the reason a colour’s is, namely that the canvas would fetch from a page we do not control. |
quantityBorderColor | colour | Outline of the quantity badge. |
quantityBackgroundColor | colour | Fill behind the quantity badge. |
quantityTextColor | colour | The quantity text. |
quantityFont | CSS font, ≤120 chars | The quantity badge’s font. Same rules as bodyFont. |
editable | boolean | Lets the reader DRAG the line, and fires orderMove where they dropped it. This is what makes an order line a control rather than a picture. |
cancellable | boolean | Shows the ✕ and fires orderCancel. Your side decides what that means. |
modifyTooltip | string | Hover text for the body, which fires orderModify when clicked rather than dragged. Says what the BUTTON does; the line’s own tooltip says what the level is. |
cancelTooltip | string | Hover text for the ✕. |
cancelButtonBorderColor | colour | Outline of the ✕ button. |
cancelButtonBackgroundColor | colour | Fill behind the ✕. |
cancelButtonIconColor | colour | The ✕ itself. |
PositionLine
Passed to createPositionLine. An entry with its protective legs, see the orders and positions guide for what a full bracket looks like on screen.
| Property | Type | Meaning |
|---|---|---|
price | number | Where the line sits, in the instrument’s own units. |
text | string | The label in the line’s body. Up to 200 characters. |
tooltip | string | Shown on hover, so detail that would crowd the label has somewhere to go. |
quantity | string | The badge at the end of the line. A string rather than a number, because it is a label: “2.5 BTC” and “50%” are both things a host needs to put there. |
lineColor | colour | The line itself. Hex or rgb(); url() is refused. |
lineWidth | pixels, 1–100 | Thickness. Zero and negative are refused. |
lineStyle | 0–4 | 0 solid · 1 dotted · 2 dashed · 3 large-dashed · 4 sparse-dotted. Anything else is refused. |
bodyAlignment | "left" | "right" | Defaults to right. Anchors the whole label, quantity and button group to the chosen plot edge. Position TP/SL, breakeven and drag-preview labels follow. Independent of lineLength and extendLeft. Set on creation or update with { bodyAlignment: "left" } to keep recent candles clear on narrow charts. |
bodyPaddingLeft | pixels, 0–100 | Inset from the left plot edge when bodyAlignment is left. Defaults to zero. Moves all controls and protection labels together; does not shorten the line. Available on creation and update. |
bodyPaddingRight | pixels, 0–100 | Right-aligned inset; default 0. |
bodyPaddingHorizontal | pixels, 0–100 | Padding on each side of body and quantity; default 6. |
bodyPaddingVertical | pixels, 0–100 | Padding above and below the row text; default 3. |
bodyBorderWidth | pixels, 0–100 | Control outline width; zero hides outlines; default 1. |
bodyBorderRadius | pixels, 0–100 or null | Body radius override; null inherits borderRadius. |
quantityBorderRadius | pixels, 0–100 or null | Quantity radius override; null inherits borderRadius. |
buttonBorderRadius | pixels, 0–100 or null | Action and drag-out button radius; null inherits borderRadius. |
buttonWidth | pixels, 0–100 | Minimum action button width; default 18. |
buttonIconWidth | pixels, 0–100 | Action icon stroke width; default 1.5. |
extendLeft | boolean | Draws the line across the full width rather than from the current bar rightward. |
lineLength | percent, 1–100 | How far left the line reaches, as a share of the plot. Only consulted when extendLeft is off, since a line pinned to the left edge already spans everything there is. |
borderRadius | pixels, 0–100 | The corner radius of every box on the line: the label body, the quantity chip and each button. Individual bodyBorderRadius, quantityBorderRadius and buttonBorderRadius overrides may be set; null restores this shared value. 0 is square; anything past half the row’s height is a full pill, the embed accepts 0–100. |
bodyBorderColor | colour | Outline of the label body. |
bodyBackgroundColor | colour | Fill behind the label text. |
bodyTextColor | colour | The label text. |
bodyFont | CSS font, ≤120 chars | The label’s font, as a CSS shorthand: bold 12px "Inter", system-ui, sans-serif. url() is refused, for the reason a colour’s is, namely that the canvas would fetch from a page we do not control. |
quantityBorderColor | colour | Outline of the quantity badge. |
quantityBackgroundColor | colour | Fill behind the quantity badge. |
quantityTextColor | colour | The quantity text. |
quantityFont | CSS font, ≤120 chars | The quantity badge’s font. Same rules as bodyFont. |
closeable | boolean | Shows the close control and fires positionClose. On by default. |
reversible | boolean | Shows the reverse control and fires positionReverse. OFF by default, because turning it on is a promise to answer that event, and a control whose press goes nowhere is worse than one that is absent. |
closeTooltip | string | Hover text for the close control. |
reverseTooltip | string | Hover text for the reverse control. |
closeButtonBorderColor | colour | Outline of the close button. |
closeButtonBackgroundColor | colour | Fill behind the close button. |
closeButtonIconColor | colour | The close glyph. |
reverseButtonBorderColor | colour | Outline of the reverse button. |
reverseButtonBackgroundColor | colour | Fill behind the reverse button. |
reverseButtonIconColor | colour | The reverse glyph. |
takeProfit | number | null | The take-profit leg. null clears it, which is why it is nullable. |
stopLoss | number | null | The stop leg. null clears it. |
breakeven | number | null | The breakeven marker. null clears it. A whole bracket is one line and one set(), so a host cancelling a stop never has to tear the position down and redraw it. |
takeProfitColor | colour | null | The take-profit leg’s ink, and the ink of its drag-out handle and the level in flight, so one leg is one colour throughout. null restores the built-in green. |
stopLossColor | colour | null | The stop leg’s ink. null restores the built-in red. |
breakevenColor | colour | null | The breakeven marker’s ink. null restores the chart theme’s muted ink. |
canAddTakeProfit | boolean | Offers the drag-out TP handle: the small square a reader pulls off the pill to ask for a take-profit at the price they release on, reported as positionAddTakeProfit. OFF by default. Turn it off again once that leg exists, or the gesture invites a second take-profit on one position. |
canAddStopLoss | boolean | The same for the stop handle, reported as positionAddStopLoss. OFF by default. |
protectTooltip | string | Hover text for both drag-out handles. |
takeProfitLabel | string, ≤24 | What the leg is CALLED on the pill at the end of its level, the “TP” in TP 43,000. An empty string draws no pill, which is how you turn the label off. Not the same property as addTakeProfitLabel: this one is a name printed beside a price, that one is the text on a button. |
stopLossLabel | string, ≤24 | The same for the stop leg. Defaults to “SL”. |
breakevenLabel | string, ≤24 | The same for the breakeven marker, and EMPTY by default: it has always drawn an unlabelled dotted reference, so naming it is opt-in rather than something that appears on charts already using it. |
addTakeProfitLabel | string, ≤24 | The text on the drag-out TP handle. The handle measures its own label and grows to fit, so a longer one is legible rather than clipped. + TP is a common choice, since the gesture creates a leg rather than moving one. |
addStopLossLabel | string, ≤24 | The text on the drag-out SL handle. Defaults to “SL”. |
pnlPositiveColor | colour or null | Positive P&L ink; null follows the chart. |
pnlNegativeColor | colour or null | Negative P&L ink; null follows the chart. |
protectLabelFont | CSS font | Font for TP, SL, breakeven and draft labels. |
protectLabelPaddingHorizontal | pixels, 0–100 | Protection-label horizontal padding; default 5. |
protectLabelPaddingVertical | pixels, 0–100 | Protection-label vertical padding; default 2. |
protectLabelBorderRadius | pixels, 0–100 | Protection-label corner radius; default 0. |
protectLabelBorderWidth | pixels, 0–100 | Protection-label outline width; default 0. |
protectLabelBackgroundColor | colour or null | Protection-label fill; null follows the leg color. |
protectLabelBorderColor | colour or null | Protection-label outline; null follows the leg color. |
protectLabelTextColor | colour or null | Protection-label ink; null uses white. |
protectButtonBackgroundColor | colour or null | Drag-out button fill; null follows the close button. |
protectButtonBorderColor | colour or null | Drag-out button outline; null follows the leg color. |
protectButtonTextColor | colour or null | Drag-out button ink; null follows the leg color. |
protectFont | CSS font, ≤120 chars | The font on both drag-out handles. Same rules as bodyFont. |
protectLineWidth | pixels, 1–100 | How thick the take-profit, stop and breakeven levels are drawn. Independent of the entry’s lineWidth, which is why it exists: thickening the entry used to leave a hairline stop beside it. |
protectLineStyle | 0–4 | The dash pattern for the take-profit and stop levels, same vocabulary as lineStyle. Breakeven keeps its own dotted pattern, because it is a reference mark rather than a resting order and that difference is what the dash is carrying. |
protectFillOpacity | 0–1 | How strongly a drag-out shades the span it is proposing. While the reader drags a handle away from the pill, everything between the entry and the level under the pointer is washed in that leg’s own colour: red down to a stop, green up to a target, so the gesture says how much is being risked and not only where the level lands. It belongs to the GESTURE: the wash goes the instant the release books the order, because a resting stop is a level and not a region. Defaults to 0.16, the same strength as the depth wash in the price gutter, so the two read as one chart. 0 turns it off and changes nothing else. |
side | "long" | "short" | null | Which way the position points. Set it whenever you offer the drag-out handles: a long takes profit above its entry and stops below it, and unset the drag constrains NOTHING, so a reader can draw a take-profit into a loss and find out from your venue’s rejection. |
editable | boolean | Lets the reader DRAG the position line, firing positionMove. Off by default, and the default is the point: a position line stands for a fill, whose price is not the reader’s to move. Turn it on only where the line stands for a level that has not been placed. |
ExecutionShape
Passed to createExecutionShape. A buy or sell marker at one bar, where a fill happened, rather than a level that persists.
| Property | Type | Meaning |
|---|---|---|
time | seconds | When it happened. SECONDS since the epoch, not milliseconds. |
price | number | The level it happened at. |
direction | "buy" | "sell" | Which way the marker points, and which side of the price it sits on. Nothing else is accepted. |
markerStyle | "arrow" | "badge" | The SHAPE. arrow is the default; a triangle at the price with the label beside it. badge puts the label INSIDE a roundel sitting against the price, which is what a trade history wants: a column of fills reads as B / S bubbles rather than as triangles each trailing a caption. It changes what two other properties mean; see text and textColor. |
text | string | The label. Beside an arrow, so it can be a sentence; INSIDE a badge, where it wants a glyph or two; a longer one grows the roundel into a pill rather than being clipped. |
tooltip | string | Shown on hover. Where a badge’s words go, since its label is one glyph. |
arrowColor | colour | The arrow, or the badge’s fill. |
textColor | colour | The label. On an arrow it is drawn on the CHART; on a badge it is drawn on arrowColor, so those two have to contrast; set them from the same place, or the letter ends up the colour of the disc it is inside. |
font | CSS font, ≤120 chars | The label’s font. Same rules as a line’s bodyFont. |
arrowHeight | pixels, 1–100 | How tall the arrow is drawn, or the badge’s radius (7–14). |
arrowSpacing | pixels, 1–100 | The gap between the marker and the candle it marks; below the bar’s low for a buy, above its high for a sell. An arrow’s tip and a badge’s near EDGE both land there, so the bar is framed rather than covered. |
ChartStyle
Passed to setStyle, using the same role names data-colors takes. Every key is optional and every value is a hex colour, so a call names only what it changes and leaves the rest of the palette at the theme's values. Each role sets a family of tokens: up moves the rising candle's body, wick and border together, so the object is smaller than the number of things it paints.
| Role | Type | Paints |
|---|---|---|
bg | hex colour | Plot background. One token. |
text | hex colour | Axis labels and legend. One token. |
grid | hex colour | Grid lines. One token. |
up | hex colour | Rising candles, body wick and border. 3 tokens, together. |
down | hex colour | Falling candles, body wick and border. 3 tokens, together. |
crosshair | hex colour | The crosshair’s two lines. One token. |
muted | hex colour | Secondary text: the countdown to the next bar, hints, sub-labels. One token. |
border | hex colour | Hairlines: the price scale, the time axis, the edges between panes. One token. |
chrome | hex colour | Toolbars, dialogs and menus — only visible with the toolbar on. One token. |
accent | hex colour | The highlight: active controls, and a drawing while it is selected. 2 tokens, together. |
setStyle({ background: '#fff' }) returns a commandError naming background, while the same mistake in data-colors drops that pair and renders the rest. A URL is written once and read by every visitor to your page, so a typo in one must not prevent the chart from rendering. See Styling.PriceScale
Returned by getPriceScale() and getVisiblePriceRange(), and carried by the priceScaleChanged event. It is the price-to-pixel mapping: everything needed to place a level of your own on the chart. Unlike every other object here it travels OUT of the frame rather than in, so it is a flat bag of numbers rather than something with methods.
| Property | Type | What it is |
|---|---|---|
from | number | The price at the BOTTOM edge of the plot band, or the top when inverted. |
to | number | The price at the other edge. |
top | number | CSS pixels from the IFRAME’s top edge to the top of the plot band. Not zero on an embed with a toolbar. |
height | number | Height of the plot band. Always above zero. |
left | number | CSS pixels from the iframe’s left edge. |
width | number | Width of the plot band. Narrower than the iframe: the price gutter is outside it. |
scale | linear or log | How price is distributed down the band. Read it rather than assuming: the reader can switch this from the chart’s own settings. |
inverted | boolean | True when the reader has flipped the scale, so from is at the top. |
chart.priceToY(price) and the arithmetic is the chart’s own, including the logarithmic and inverted cases. See Methods.ToolbarButton
Passed to createToolbarButton, which additionally takes align (left or right, defaulting to right) at creation only. These three are what a button can change about itself afterwards, through button.set().
| Property | Type | Meaning |
|---|---|---|
text | string, ≤32 | The label. Short, because the cell sits in a fixed row beside the chart’s own controls and a long one displaces them. |
tooltip | string | Detail on hover. Never the button’s identity: title does not exist on a touchscreen, so anything a reader must know goes in text. |
active | boolean | The pressed state, for a button that is a TOGGLE. Setting it once is what makes the control announce itself as a switch, so leave it out on a plain action. |
icon | icon name | null | A glyph before the label, from a fixed list we draw ourselves: star, bookmark, bell, settings, plus, refresh, download, link, search, camera, expand, info. Never markup, a data URI or a URL: those would put your DOM, or a fetch you can watch, on our origin, which is the one thing the iframe exists to prevent. It never replaces text, which stays the accessible name. |
disabled | boolean | Present but not on offer: announced as disabled, skipped by the Tab key, and its presses are not reported. Use it where removing the button instead would make the header shuffle every time the symbol changes. |
html, no icon and no className, and that is the frame boundary rather than an omission: your code does not execute on our origin, which is the whole reason the embed is an iframe, so an option taking markup would hand back exactly what it exists to withhold. What you get instead is a control already matching the chart it sits in, on both themes.How a bad object is refused
Never silently. An unknown property is refused by name, and a known property outside its domain is refused too.
await chart.createOrderLine({ price: 42000, lineColour: '#f00' });
// commandError: unknown property "lineColour" ← a typo, named
await chart.createOrderLine({ price: 42000, lineStyle: 9 });
// commandError: lineStyle must be 0-4 ← in range, not in domainnumber. lineStyle: 9 used to be accepted, applied, and draw nothing, accepted-then-silently-dropped, which is exactly what a property table exists to prevent. There is no honest way to document a domain of 0–4 for a field that takes any number.