Skip to main content
Version: Next

Interface: IChartApi

The main interface of a single chart using time for horizontal scale.

Hierarchy

Methods

applyOptions

applyOptions(options): void

Applies new options to the chart

Parameters

NameTypeDescription
optionsDeepPartial<TimeChartOptions>Any subset of options.

Returns

void

Overrides

IChartApiBase.applyOptions


remove

remove(): void

Removes the chart object including all DOM elements. This is an irreversible operation, you cannot do anything with the chart after removing it.

Returns

void

Inherited from

IChartApiBase.remove


resize

resize(width, height, forceRepaint?): void

Sets fixed size of the chart. By default chart takes up 100% of its container.

If chart has the autoSize option enabled, and the ResizeObserver is available then the width and height values will be ignored.

Parameters

NameTypeDescription
widthnumberTarget width of the chart.
heightnumberTarget height of the chart.
forceRepaint?booleanTrue to initiate resize immediately. One could need this to get screenshot immediately after resize.

Returns

void

Inherited from

IChartApiBase.resize


addCustomSeries

addCustomSeries<TData, TOptions, TPartialOptions>(customPaneView, customOptions?): ISeriesApi<"Custom", Time, TData | WhitespaceData<Time>, TOptions, TPartialOptions>

Creates a custom series with specified parameters.

A custom series is a generic series which can be extended with a custom renderer to implement chart types which the library doesn't support by default.

Type parameters

NameType
TDataextends CustomData<Time, TData>
TOptionsextends CustomSeriesOptions
TPartialOptionsextends DeepPartial<TOptions & SeriesOptionsCommon> = DeepPartial<TOptions & SeriesOptionsCommon>

Parameters

NameTypeDescription
customPaneViewICustomSeriesPaneView<Time, TData, TOptions>A custom series pane view which implements the custom renderer.
customOptions?DeepPartial<TOptions & SeriesOptionsCommon>Customization parameters of the series being created. js const series = chart.addCustomSeries(myCustomPaneView);

Returns

ISeriesApi<"Custom", Time, TData | WhitespaceData<Time>, TOptions, TPartialOptions>

Inherited from

IChartApiBase.addCustomSeries


addAreaSeries

addAreaSeries(areaOptions?): ISeriesApi<"Area", Time, WhitespaceData<Time> | AreaData<Time>, AreaSeriesOptions, DeepPartial<AreaStyleOptions & SeriesOptionsCommon>>

Creates an area series with specified parameters.

Example

const series = chart.addAreaSeries();

Parameters

NameTypeDescription
areaOptions?DeepPartial<AreaStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Area", Time, WhitespaceData<Time> | AreaData<Time>, AreaSeriesOptions, DeepPartial<AreaStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addAreaSeries


addBaselineSeries

addBaselineSeries(baselineOptions?): ISeriesApi<"Baseline", Time, WhitespaceData<Time> | BaselineData<Time>, BaselineSeriesOptions, DeepPartial<BaselineStyleOptions & SeriesOptionsCommon>>

Creates a baseline series with specified parameters.

Example

const series = chart.addBaselineSeries();

Parameters

NameTypeDescription
baselineOptions?DeepPartial<BaselineStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Baseline", Time, WhitespaceData<Time> | BaselineData<Time>, BaselineSeriesOptions, DeepPartial<BaselineStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addBaselineSeries


addBarSeries

addBarSeries(barOptions?): ISeriesApi<"Bar", Time, WhitespaceData<Time> | BarData<Time>, BarSeriesOptions, DeepPartial<BarStyleOptions & SeriesOptionsCommon>>

Creates a bar series with specified parameters.

Example

const series = chart.addBarSeries();

Parameters

NameTypeDescription
barOptions?DeepPartial<BarStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Bar", Time, WhitespaceData<Time> | BarData<Time>, BarSeriesOptions, DeepPartial<BarStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addBarSeries


addCandlestickSeries

addCandlestickSeries(candlestickOptions?): ISeriesApi<"Candlestick", Time, WhitespaceData<Time> | CandlestickData<Time>, CandlestickSeriesOptions, DeepPartial<CandlestickStyleOptions & SeriesOptionsCommon>>

Creates a candlestick series with specified parameters.

Example

const series = chart.addCandlestickSeries();

Parameters

NameTypeDescription
candlestickOptions?DeepPartial<CandlestickStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Candlestick", Time, WhitespaceData<Time> | CandlestickData<Time>, CandlestickSeriesOptions, DeepPartial<CandlestickStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addCandlestickSeries


addHistogramSeries

addHistogramSeries(histogramOptions?): ISeriesApi<"Histogram", Time, WhitespaceData<Time> | HistogramData<Time>, HistogramSeriesOptions, DeepPartial<HistogramStyleOptions & SeriesOptionsCommon>>

Creates a histogram series with specified parameters.

Example

const series = chart.addHistogramSeries();

Parameters

NameTypeDescription
histogramOptions?DeepPartial<HistogramStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Histogram", Time, WhitespaceData<Time> | HistogramData<Time>, HistogramSeriesOptions, DeepPartial<HistogramStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addHistogramSeries


addLineSeries

addLineSeries(lineOptions?): ISeriesApi<"Line", Time, WhitespaceData<Time> | LineData<Time>, LineSeriesOptions, DeepPartial<LineStyleOptions & SeriesOptionsCommon>>

Creates a line series with specified parameters.

Example

const series = chart.addLineSeries();

Parameters

NameTypeDescription
lineOptions?DeepPartial<LineStyleOptions & SeriesOptionsCommon>Customization parameters of the series being created.

Returns

ISeriesApi<"Line", Time, WhitespaceData<Time> | LineData<Time>, LineSeriesOptions, DeepPartial<LineStyleOptions & SeriesOptionsCommon>>

An interface of the created series.

Inherited from

IChartApiBase.addLineSeries


removeSeries

removeSeries(seriesApi): void

Removes a series of any type. This is an irreversible operation, you cannot do anything with the series after removing it.

Example

chart.removeSeries(series);

Parameters

NameType
seriesApiISeriesApi<keyof SeriesOptionsMap, Time, CustomData<Time> | WhitespaceData<Time> | AreaData<Time> | BaselineData<Time> | BarData<Time> | CandlestickData<Time> | HistogramData<Time> | LineData<Time> | CustomSeriesWhitespaceData<Time>, CustomSeriesOptions | AreaSeriesOptions | BaselineSeriesOptions | BarSeriesOptions | CandlestickSeriesOptions | HistogramSeriesOptions | LineSeriesOptions, DeepPartial<AreaStyleOptions & SeriesOptionsCommon> | DeepPartial<BaselineStyleOptions & SeriesOptionsCommon> | DeepPartial<BarStyleOptions & SeriesOptionsCommon> | DeepPartial<CandlestickStyleOptions & SeriesOptionsCommon> | DeepPartial<HistogramStyleOptions & SeriesOptionsCommon> | DeepPartial<LineStyleOptions & SeriesOptionsCommon> | DeepPartial<CustomStyleOptions & SeriesOptionsCommon>>

Returns

void

Inherited from

IChartApiBase.removeSeries


subscribeClick

subscribeClick(handler): void

Subscribe to the chart click event.

Example

function myClickHandler(param) {
if (!param.point) {
return;
}

console.log(`Click at ${param.point.x}, ${param.point.y}. The time is ${param.time}.`);
}

chart.subscribeClick(myClickHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Handler to be called on mouse click.

Returns

void

Inherited from

IChartApiBase.subscribeClick


unsubscribeClick

unsubscribeClick(handler): void

Unsubscribe a handler that was previously subscribed using subscribeClick.

Example

chart.unsubscribeClick(myClickHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Previously subscribed handler

Returns

void

Inherited from

IChartApiBase.unsubscribeClick


subscribeDblClick

subscribeDblClick(handler): void

Subscribe to the chart double-click event.

Example

function myDblClickHandler(param) {
if (!param.point) {
return;
}

console.log(`Double Click at ${param.point.x}, ${param.point.y}. The time is ${param.time}.`);
}

chart.subscribeDblClick(myDblClickHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Handler to be called on mouse double-click.

Returns

void

Inherited from

IChartApiBase.subscribeDblClick


unsubscribeDblClick

unsubscribeDblClick(handler): void

Unsubscribe a handler that was previously subscribed using subscribeDblClick.

Example

chart.unsubscribeDblClick(myDblClickHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Previously subscribed handler

Returns

void

Inherited from

IChartApiBase.unsubscribeDblClick


subscribeCrosshairMove

subscribeCrosshairMove(handler): void

Subscribe to the crosshair move event.

Example

function myCrosshairMoveHandler(param) {
if (!param.point) {
return;
}

console.log(`Crosshair moved to ${param.point.x}, ${param.point.y}. The time is ${param.time}.`);
}

chart.subscribeCrosshairMove(myCrosshairMoveHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Handler to be called on crosshair move.

Returns

void

Inherited from

IChartApiBase.subscribeCrosshairMove


unsubscribeCrosshairMove

unsubscribeCrosshairMove(handler): void

Unsubscribe a handler that was previously subscribed using subscribeCrosshairMove.

Example

chart.unsubscribeCrosshairMove(myCrosshairMoveHandler);

Parameters

NameTypeDescription
handlerMouseEventHandler<Time>Previously subscribed handler

Returns

void

Inherited from

IChartApiBase.unsubscribeCrosshairMove


priceScale

priceScale(priceScaleId): IPriceScaleApi

Returns API to manipulate a price scale.

Parameters

NameTypeDescription
priceScaleIdstringID of the price scale.

Returns

IPriceScaleApi

Price scale API.

Inherited from

IChartApiBase.priceScale


timeScale

timeScale(): ITimeScaleApi<Time>

Returns API to manipulate the time scale

Returns

ITimeScaleApi<Time>

Target API

Inherited from

IChartApiBase.timeScale


options

options(): Readonly<ChartOptionsImpl<Time>>

Returns currently applied options

Returns

Readonly<ChartOptionsImpl<Time>>

Full set of currently applied options, including defaults

Inherited from

IChartApiBase.options


takeScreenshot

takeScreenshot(): HTMLCanvasElement

Make a screenshot of the chart with all the elements excluding crosshair.

Returns

HTMLCanvasElement

A canvas with the chart drawn on. Any Canvas methods like toDataURL() or toBlob() can be used to serialize the result.

Inherited from

IChartApiBase.takeScreenshot


autoSizeActive

autoSizeActive(): boolean

Returns the active state of the autoSize option. This can be used to check whether the chart is handling resizing automatically with a ResizeObserver.

Returns

boolean

Whether the autoSize option is enabled and the active.

Inherited from

IChartApiBase.autoSizeActive


chartElement

chartElement(): HTMLDivElement

Returns the generated div element containing the chart. This can be used for adding your own additional event listeners, or for measuring the elements dimensions and position within the document.

Returns

HTMLDivElement

generated div element containing the chart.

Inherited from

IChartApiBase.chartElement


setCrosshairPosition

setCrosshairPosition(price, horizontalPosition, seriesApi): void

Set the crosshair position within the chart.

Usually the crosshair position is set automatically by the user's actions. However in some cases you may want to set it explicitly.

For example if you want to synchronise the crosshairs of two separate charts.

Parameters

NameTypeDescription
pricenumberThe price (vertical coordinate) of the new crosshair position.
horizontalPositionTimeThe horizontal coordinate (time by default) of the new crosshair position.
seriesApiISeriesApi<keyof SeriesOptionsMap, Time, CustomData<Time> | WhitespaceData<Time> | AreaData<Time> | BaselineData<Time> | BarData<Time> | CandlestickData<Time> | HistogramData<Time> | LineData<Time> | CustomSeriesWhitespaceData<Time>, CustomSeriesOptions | AreaSeriesOptions | BaselineSeriesOptions | BarSeriesOptions | CandlestickSeriesOptions | HistogramSeriesOptions | LineSeriesOptions, DeepPartial<AreaStyleOptions & SeriesOptionsCommon> | DeepPartial<BaselineStyleOptions & SeriesOptionsCommon> | DeepPartial<BarStyleOptions & SeriesOptionsCommon> | DeepPartial<CandlestickStyleOptions & SeriesOptionsCommon> | DeepPartial<HistogramStyleOptions & SeriesOptionsCommon> | DeepPartial<LineStyleOptions & SeriesOptionsCommon> | DeepPartial<CustomStyleOptions & SeriesOptionsCommon>>-

Returns

void

Inherited from

IChartApiBase.setCrosshairPosition


clearCrosshairPosition

clearCrosshairPosition(): void

Clear the crosshair position within the chart.

Returns

void

Inherited from

IChartApiBase.clearCrosshairPosition


paneSize

paneSize(): PaneSize

Returns the dimensions of the chart pane (the plot surface which excludes time and price scales). This would typically only be useful for plugin development.

Returns

PaneSize

Dimensions of the chart pane

Inherited from

IChartApiBase.paneSize