Skip to main content
Version: 4.0

Interface: IChartApi

The main interface of a single chart.

Methods​

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

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​

• width: number

Target width of the chart.

• height: number

Target height of the chart.

• forceRepaint?: boolean

True to initiate resize immediately. One could need this to get screenshot immediately after resize.

Returns​

void

addAreaSeries()​

addAreaSeries(areaOptions?): ISeriesApi<"Area">

Creates an area series with specified parameters.

Parameters​

• areaOptions?: DeepPartial <AreaStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Area">

An interface of the created series.

Example​

const series = chart.addAreaSeries();

addBaselineSeries()​

addBaselineSeries(baselineOptions?): ISeriesApi<"Baseline">

Creates a baseline series with specified parameters.

Parameters​

• baselineOptions?: DeepPartial <BaselineStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Baseline">

An interface of the created series.

Example​

const series = chart.addBaselineSeries();

addBarSeries()​

addBarSeries(barOptions?): ISeriesApi<"Bar">

Creates a bar series with specified parameters.

Parameters​

• barOptions?: DeepPartial <BarStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Bar">

An interface of the created series.

Example​

const series = chart.addBarSeries();

addCandlestickSeries()​

addCandlestickSeries(candlestickOptions?): ISeriesApi<"Candlestick">

Creates a candlestick series with specified parameters.

Parameters​

• candlestickOptions?: DeepPartial <CandlestickStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Candlestick">

An interface of the created series.

Example​

const series = chart.addCandlestickSeries();

addHistogramSeries()​

addHistogramSeries(histogramOptions?): ISeriesApi<"Histogram">

Creates a histogram series with specified parameters.

Parameters​

• histogramOptions?: DeepPartial <HistogramStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Histogram">

An interface of the created series.

Example​

const series = chart.addHistogramSeries();

addLineSeries()​

addLineSeries(lineOptions?): ISeriesApi<"Line">

Creates a line series with specified parameters.

Parameters​

• lineOptions?: DeepPartial <LineStyleOptions & SeriesOptionsCommon>

Customization parameters of the series being created.

Returns​

ISeriesApi<"Line">

An interface of the created series.

Example​

const series = chart.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.

Parameters​

• seriesApi: ISeriesApi<keyof SeriesOptionsMap>

Returns​

void

Example​

chart.removeSeries(series);

subscribeClick()​

subscribeClick(handler): void

Subscribe to the chart click event.

Parameters​

• handler: MouseEventHandler

Handler to be called on mouse click.

Returns​

void

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);

unsubscribeClick()​

unsubscribeClick(handler): void

Unsubscribe a handler that was previously subscribed using subscribeClick.

Parameters​

• handler: MouseEventHandler

Previously subscribed handler

Returns​

void

Example​

chart.unsubscribeClick(myClickHandler);

subscribeCrosshairMove()​

subscribeCrosshairMove(handler): void

Subscribe to the crosshair move event.

Parameters​

• handler: MouseEventHandler

Handler to be called on crosshair move.

Returns​

void

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);

unsubscribeCrosshairMove()​

unsubscribeCrosshairMove(handler): void

Unsubscribe a handler that was previously subscribed using subscribeCrosshairMove.

Parameters​

• handler: MouseEventHandler

Previously subscribed handler

Returns​

void

Example​

chart.unsubscribeCrosshairMove(myCrosshairMoveHandler);

priceScale()​

priceScale(priceScaleId): IPriceScaleApi

Returns API to manipulate a price scale.

Parameters​

• priceScaleId: string

ID of the price scale.

Returns​

IPriceScaleApi

Price scale API.

timeScale()​

timeScale(): ITimeScaleApi

Returns API to manipulate the time scale

Returns​

ITimeScaleApi

Target API

applyOptions()​

applyOptions(options): void

Applies new options to the chart

Parameters​

• options: DeepPartial <ChartOptions>

Any subset of options.

Returns​

void

options()​

options(): Readonly <ChartOptions>

Returns currently applied options

Returns​

Readonly <ChartOptions>

Full set of currently applied options, including defaults

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.

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.