Skip to main content

IChartingLibraryWidget

Interface

The main interface for interacting with the library, returned by ChartingLibraryWidgetConstructor. For more information, refer to the Widget methods article.

Methods

activeChart

Get an API object for interacting with the active chart. For example, you can subscribe to events on the active chart, such as IChartWidgetApi.onIntervalChanged. Note that the library does not manage the event subscriptions when users switch between the charts on the multiple-chart layout. If necessary, you should manually unsubscribe from the previous chart and subscribe to the newly selected one. To track the currently active chart, use the SubscribeEventsMap.activeChartChanged event.

Signature

activeChart() => IChartWidgetApi

Returns

An API object for interacting with the chart.

IChartWidgetApi


activeChartIndex

Get the index of the active chart in the layout.

Signature

activeChartIndex() => number

Returns

number.

number


addCustomCSSFile

Add a custom CSS file for the library to load.

Signature

addCustomCSSFile(url: string) => void

Parameters

NameTypeDescription
urlstringA url to the custom CSS file. Should be absolute or relative to the static folder.

Returns

void


applyOverrides

Apply overrides to the chart without reloading. See also ChartingLibraryWidgetOptions.overrides.

Signature

applyOverrides<TOverrides>(overrides: TOverrides) => void

Type parameters

NameType
TOverridesextends Partial<ChartPropertiesOverrides>

Parameters

NameTypeDescription
overridesTOverridesAn object of overrides to apply to the chart.

Returns

void


applyStudiesOverrides

Apply overrides to indicator styles and inputs without reloading. Refer to Indicator Overrides for more information. Overrides for built-in indicators are listed in StudyOverrides.

Signature

applyStudiesOverrides(overrides: object) => void

Parameters

NameTypeDescription
overridesobjectAn object of overrides to apply to the studies.

Returns

void


changeTheme

Change the theme of the chart.

Signature

changeTheme(themeName: ThemeName, options?: ChangeThemeOptions) => Promise<void>

Parameters

NameTypeDescription
themeNameThemeNameA theme name.
options?ChangeThemeOptionsAn optional object of options for the theme.

Returns

A promise that resolves when the theme has been changed.

Promise<void>


chart

Get an API instance that can be used to interact with a chart.

Signature

chart(index?: number) => IChartWidgetApi

Parameters

NameTypeDescription
index?numberZero based index of the chart.

Returns

An API instance.

IChartWidgetApi


chartsCount

Get the number of charts in the current layout.

Signature

chartsCount() => number

Returns

A count of the charts in the current layout.

number


clearUndoHistory

Clears the undo & redo history.

Warning: this should only be used in very specific cases where you have considered the UX implications. It is generally unexpected for the user that the undo history has been cleared.

An example of an acceptable use-case would be reusing a chart when switching pages / tabs on a Single Page Application, and presenting it to the user as a new chart.

Signature

clearUndoHistory() => void

Returns

void


closePopupsAndDialogs

Close all open context menus, pop-ups or dialogs.

Signature

closePopupsAndDialogs() => void

Returns

void


createButton

Create a button in the top toolbar. This should be called after headerReady has resolved.

Example

widget.headerReady().then(function() {
var button = widget.createButton();
button.setAttribute('title', 'My custom button tooltip');
button.addEventListener('click', function() { alert("My custom button pressed!"); });
button.textContent = 'My custom button caption';
});

Signature

createButton(options?: CreateHTMLButtonOptions) => HTMLElement

Parameters

NameTypeDescription
options?CreateHTMLButtonOptionsA optional object of options for the button.

Returns

A HTMLElement you can customize.

HTMLElement


Create a button in the top toolbar. This should be called after headerReady has resolved. If the title option is provided then the title text will be shown in a tooltip on hover. If the onClick option is provided then the button will be clickable.

Signature

createButton(options?: CreateTradingViewStyledButtonOptions) => void

Parameters

NameTypeDescription
options?CreateTradingViewStyledButtonOptionsA optional object of options for the button.

Returns

void


Create a button in the top toolbar. This should be called after headerReady has resolved.

Signature

createButton(options?: CreateButtonOptions) => HTMLElement

Parameters

NameTypeDescription
options?CreateButtonOptionsA optional object of options for the button.

Returns

A HTMLElement if the useTradingViewStyle option if false . undefined if useTradingViewStyle is true .

HTMLElement


createDropdown

Add a custom dropdown menu to the top toolbar.

Example

widget.createDropdown(
{
title: 'dropdown',
tooltip: 'tooltip for this dropdown',
items: [
{
title: 'item#1',
onSelect: () => {console.log('1');},
},
{
title: 'item#2',
onSelect: () => {widget.setSymbol('IBM', '1D');},
},
{
title: 'item#3',
onSelect: () => {
widget.activeChart().createStudy(
'MACD',
false,
false,
{
in_0: 14,
in_1: 30,
in_3: 'close',
in_2: 9
}
);
},
}
],
icon: `<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28"><g fill="none" stroke="currentColor"><circle cx="10" cy="10" r="2.5"/><circle cx="18" cy="18" r="2.5"/><path stroke-linecap="square" d="M17.5 7.5l-7 13"/></g></svg>`,
}
).then(myDropdownApi => {
// Use myDropdownApi if you need to update the dropdown:
// myDropdownApi.applyOptions({
// title: 'a new title!'
// });

// Or remove the dropdown:
// myDropdownApi.remove();
});

Signature

createDropdown(params: DropdownParams) => Promise<IDropdownApi>

Parameters

NameType
paramsDropdownParams

Returns

Promise<IDropdownApi>


crosshairSync

Only available in Trading Platform. Get a watched value that can be used to read/write/subscribe to the state of the crosshair sync between charts.

Example

widget.crosshairSync().setValue(true);

Signature

crosshairSync() => IWatchedValue<boolean>

Returns

A watched value of the state of the crosshair sync.

IWatchedValue<boolean>


currencyAndUnitVisibility

Get a watched value that can be used to read/write/subscribe to the state of the currency and unit visibility setting on the price scale.

Signature

currencyAndUnitVisibility() => IWatchedValue<VisibilityType>

Returns

A watched value of the state of the currency and unit visibility option.

IWatchedValue<VisibilityType>


customSymbolStatus

Get an API object for creating, and adjusting, custom status items to be displayed within the legend for the main series of each chart.

This can only be accessed when the chart has been created. (headerReady)

Signature

customSymbolStatus() => ICustomSymbolStatusApi

Returns

An API object for controlling additional custom status items within the legend area.

ICustomSymbolStatusApi


customThemes

Get a promise that resolves with an API object for interacting with the custom themes.

Signature

customThemes() => Promise<ICustomThemesApi>

Returns

An API object for interacting with the custom themes.

Promise<ICustomThemesApi>


dateFormat

Get a watched value that can be used to read/write/subscribe to the state of the date format.

Signature

dateFormat() => IWatchedValue<"dd MMM 'yy" | "MMM 'yy" | "MMM dd, yyyy" | "MMM yyyy" | "MMM dd" | "dd MMM" | "yyyy-MM-dd" | "yy-MM-dd" | "yy/MM/dd" | "yyyy/MM/dd" | "dd-MM-yyyy" | "dd-MM-yy" | "dd/MM/yy" | "dd/MM/yyyy" | "MM/dd/yy" | "MM/dd/yyyy">

Returns

A watched value of the state of the date format.

IWatchedValue<"dd MMM 'yy" | "MMM 'yy" | "MMM dd, yyyy" | "MMM yyyy" | "MMM dd" | "dd MMM" | "yyyy-MM-dd" | "yy-MM-dd" | "yy/MM/dd" | "yyyy/MM/dd" | "dd-MM-yyyy" | "dd-MM-yy" | "dd/MM/yy" | "dd/MM/yyyy" | "MM/dd/yy" | "MM/dd/yyyy">


dateRangeSync

Only available in Trading Platform. Get a watched value that can be used to read/write/subscribe to the state of the date range sync between charts.

Example

widget.dateRangeSync().setValue(true);

Signature

dateRangeSync() => IWatchedValue<boolean>

Returns

A watched value of the state of the date range sync.

IWatchedValue<boolean>


drawOnAllChartsEnabled

Get a watched value that read/write/subscribe to the state of the 'draw on all charts' mode.

When enabled new drawings will be replicated to all charts in the layout and shown when the same ticker is selected.

Signature

drawOnAllChartsEnabled() => IWatchedValue<boolean>

Returns

IWatchedValue<boolean>


exitFullscreen

Set the chart into non-fullscreen mode (if it isn't already).

Signature

exitFullscreen() => void

Returns

void


getCSSCustomPropertyValue

Returns the current value for a CSS custom property.

Example:

const currentValue = widget.getCSSCustomPropertyValue('--my-theme-color');

Signature

getCSSCustomPropertyValue(customPropertyName: string) => string

Parameters

NameTypeDescription
customPropertyNamestringA string representing the CSS custom property name to be checked. It is expected that the name should start with a double hyphen ('--').

Returns

A string containing the value of the property. If not set, returns the empty string.

string


getIntervals

Get an array of supported intervals (resolutions).

Signature

getIntervals() => string[]

Returns

An array of supported intervals. E.g. ['1D', '5D', '1Y'] .

string[]


getLanguage

Get the configured locale of the widget. For example en, zh, ru.

Signature

getLanguage() => LanguageCode

Returns

A code representing the locale of the widget.

LanguageCode


getSavedCharts

Get a list of chart descriptions saved to the server for the current user.

Signature

getSavedCharts(callback: Function) => void

Parameters

NameTypeDescription
callback(chartRecords: SaveLoadChartRecord[]) => voidA function called with an array of saved chart information as the first argument.

Returns

void


getStudiesList

Get an array of the names of all supported studies. These names can be used when calling IChartWidgetApi.createStudy.

Signature

getStudiesList() => string[]

Returns

An array of supported study names. E.g. ['Accumulation/Distribution', 'Accumulative Swing Index', 'Advance/Decline', ...] .

string[]


getStudyInputs

Get an array of information about indicator inputs, including their names. You need to know an input name to refer to this property in the code. For example, when you change an input value using the overrides. Consider the Input property section for more information.

Signature

getStudyInputs(studyName: string) => StudyInputInformation[]

Parameters

NameTypeDescription
studyNamestringThe name of a study.

Returns

StudyInputInformation[]


getStudyStyles

Get information about indicator properties. You can use this information to refer to the properties in the code. For example, when you change property values using the overrides.

Note that getStudyStyles does not return actual property names but the indicator's metadata. Consider the Property path section for more information on how to refer to the properties.

Signature

getStudyStyles(studyName: string) => StudyStyleInfo

Parameters

NameTypeDescription
studyNamestringThe name of a indicator.

Returns

StudyStyleInfo


getTheme

Get the current theme of the chart.

Example

console.log(widget.getTheme());

Signature

getTheme() => ThemeName

Returns

A theme name. The name of the current theme.

ThemeName


headerReady

A promise that resolves if and when the header is ready to be used.

Signature

headerReady() => Promise<void>

Returns

Promise<void>


hideAllDrawingTools

Get a watched value that can be used to read/write/subscribe to the state of the "Hide All Drawing Tools" button.

Signature

hideAllDrawingTools() => IWatchedValue<boolean>

Returns

A watched value of the state of the "Hide All Drawing Tools" button.

IWatchedValue<boolean>


intervalSync

Only available in Trading Platform. Get a watched value that can be used to read/write/subscribe to the state of the interval sync between charts.

Example

widget.intervalSync().setValue(true);

Signature

intervalSync() => IWatchedValue<boolean>

Returns

A watched value of the state of the interval sync.

IWatchedValue<boolean>


layout

Get the current chart layout type.

Signature

layout() => LayoutType

Returns

A string representation of the current layout type. E.g. '2h' for two charts split vertically.

LayoutType


layoutName

Get the name of the current chart layout. The return value will be undefined if the current layout has not been saved.

Signature

layoutName() => string

Returns

A string of the name of the current chart layout.

string


load

Loads the chart state from a object. This method is part of the low-level save/load API.

Signature

load(state: object, extendedData?: SavedStateMetaInfo) => void

Parameters

NameTypeDescription
stateobjectA chart state object to load.
extendedData?SavedStateMetaInfoA optional object of information about the saved state.

Returns

void


loadChartFromServer

Load a saved chart from the server.

Signature

loadChartFromServer(chartRecord: SaveLoadChartRecord) => void

Parameters

NameTypeDescription
chartRecordSaveLoadChartRecordA chart information object (returned by getSavedCharts).

Returns

void


lockAllDrawingTools

Get a watched value that can be used to read/write/subscribe to the state of the "Lock All Drawing Tools" button.

Signature

lockAllDrawingTools() => IWatchedValue<boolean>

Returns

A watched value of the state of the "Lock All Drawing Tools" button.

IWatchedValue<boolean>


magnetEnabled

Get a watched value that can be used to read/write/subscribe to the state of the magnet.

Signature

magnetEnabled() => IWatchedValue<boolean>

Returns

A watched value of the state of the magnet.

IWatchedValue<boolean>


magnetMode

Get a watched value that can be used to read/write/subscribe to the state of the magnet mode.

Signature

magnetMode() => IWatchedValue<number>

Returns

A watched value of the state of the magnet mode.

IWatchedValue<number>


mainSeriesPriceFormatter

Get the price formatter for the main series. You can use this to format prices as the char

Signature

mainSeriesPriceFormatter() => INumberFormatter

Returns

INumberFormatter


Get a watched value that can be used to read/write/subscribe to the state of the navigation buttons.

Signature

navigationButtonsVisibility() => IWatchedValue<VisibilityType>

Returns

A watched value of the state of the navigation buttons.

IWatchedValue<VisibilityType>


news

Trading Platform only. Get a promise that resolves with an API object for interacting with the widgetbar (right sidebar) news widget.

Signature

news() => Promise<INewsApi>

Returns

An API object for interacting with the widgetbar (right sidebar) widget.

Promise<INewsApi>


onChartReady

The library will call callback when the chart is ready to be used.

Signature

onChartReady(callback: EmptyCallback) => void

Parameters

NameTypeDescription
callbackEmptyCallbackA function that will be called when the chart is ready to be used.

Returns

void


onContextMenu

The widget will call the callback function each time the widget wants to display a context menu. See also ChartingLibraryWidgetOptions.context_menu.

Example

widget.onChartReady(function() {
widget.onContextMenu(function(unixtime, price) {
return [{
position: "top",
text: "First top menu item, time: " + unixtime + ", price: " + price,
click: function() { alert("First clicked."); }
},
{ text: "-", position: "top" }, // Adds a separator between buttons
{ text: "-Paste" }, // Removes the existing item from the menu
{
position: "top",
text: "Second top menu item 2",
click: function() { alert("Second clicked."); }
}, {
position: "bottom",
text: "Bottom menu item",
click: function() { alert("Third clicked."); }
}];
});
});

Signature

onContextMenu(callback: Function) => void

Parameters

NameTypeDescription
callback(unixTime: number, price: number) => ContextMenuItem[]A function called with the time and price of the location on the chart that triggered the context menu. The array of objects returned will add or remove items from the context menu.

Returns

void


onGrayedObjectClicked

The library will call callback when a greyed-out drawing tool or study is clicked.

Signature

onGrayedObjectClicked(callback: Function) => void

Parameters

NameTypeDescription
callback(obj: GrayedObject) => voidA function that will be called when a greyed-out drawing tool or study is clicked.

Returns

void


onShortcut

The library will call callback when the shortCut keys are input.

Use a string separated by '+' for shortcuts using an alphabet character (A to Z) with optional modifiers (ctrl, shift, alt). Use a number for shortcuts using non-alphabet character without modifiers. If you don't know the key code you need you can use resources like keycode.info, or MDN to check. Use an array of literal key codes and modifier strings for shortcuts using non-alphabet characters with optional modifier strings.

Example

widget.onShortcut("alt+q", function() {
widget.chart().executeActionById("symbolSearch");
});

// F1
widget.onShortcut(112, function() {
widget.chart().executeActionById("symbolSearch");
});

// ctrl+shift+\
widget.onShortcut(['ctrl', 'shift', 220], function() {
widget.chart().executeActionById("symbolSearch");
});

Signature

onShortcut(shortCut: string | number | (string | number)[], callback: EmptyCallback) => void

Parameters

NameTypeDescription
shortCutstring | number | (string | number)[]A number, a string, or an array of number and string.
callbackEmptyCallbackA function that will be called when the shortCut keys are input.

Returns

void


paneButtonsVisibility

Get a watched value that can be used to read/write/subscribe to the state of the pane buttons.

Signature

paneButtonsVisibility() => IWatchedValue<VisibilityType>

Returns

A watched value of the state of the pane buttons.

IWatchedValue<VisibilityType>


remove

Remove the widget and all its data from the page. The widget cannot be interacted with after it has been removed.

Signature

remove() => void

Returns

void


removeChartFromServer

Remove a saved chart from the server.

Signature

removeChartFromServer(chartId: string | number, onCompleteCallback: EmptyCallback) => void

Parameters

NameTypeDescription
chartIdstring | numberA chart ID from a SaveLoadChartRecord (returned by getSavedCharts).
onCompleteCallbackEmptyCallbackA callback function called when the chart is successfully saved.

Returns

void


resetLayoutSizes

Resets the sizes of all charts within a multiple-chart layout back to their initial default values. This action redistributes the space equally among all charts to ensure consistency in layout design.

Signature

resetLayoutSizes(disableUndo?: boolean) => void

Parameters

NameTypeDescription
disableUndo?booleanWhen set to true, the reset action is not added to the undo stack. Hence, the user cannot undo the reset operation.

Returns

void


save

Saves the chart state to a object. This method is part of the low-level save/load API.

Signature

save(callback: Function, options?: SaveChartOptions) => void

Parameters

NameTypeDescription
callback(state: object) => voidA function called with the chart state as the first argument.
options?SaveChartOptionsOptions for customising the saved data.

Returns

void


saveChartToServer

Save the current chart to the server.

Signature

saveChartToServer(onComplete?: EmptyCallback, onFail?: Function, options?: SaveChartToServerOptions) => void

Parameters

NameTypeDescription
onComplete?EmptyCallbackAn optional callback function called when the chart is successfully saved.
onFail?(error: SaveChartErrorInfo) => voidAn optional callback function called when the chart fails to save.
options?SaveChartToServerOptionsAn optional object of options for saving the chart.

Returns

void


selectLineTool

Select an icon. It's the same as clicking on the corresponding button in the left toolbar.

Signature

selectLineTool(linetool: "icon", options?: IconOptions) => void

Parameters

NameTypeDescription
linetool"icon"An icon drawing tool.
options?IconOptionsAn optional object with options.

Returns

void


Select a drawing or a cursor. It's the same as clicking on the corresponding button in the left toolbar.

Signature

selectLineTool(linetool: Omit<"icon", SupportedLineTools>) => void

Parameters

NameTypeDescription
linetoolOmit<"icon", SupportedLineTools>A drawing or cursor to select (excluding 'icon')

Returns

void


Select the Icon line tool. It's the same as clicking on the corresponding button in the left toolbar.

Signature

selectLineTool(linetool: "icon", options?: IconOptions) => void

Parameters

NameTypeDescription
linetool"icon"Icon line tool.
options?IconOptionsAn optional object with options. Currently only used for the 'icon' drawing.

Returns

void


Select the Emoji line tool. It's the same as clicking on the corresponding button in the left toolbar.

Signature

selectLineTool(linetool: "emoji", options?: EmojiOptions) => void

Parameters

NameTypeDescription
linetool"emoji"Emoji line tool.
options?EmojiOptionsOptions for the Emoji line tool

Returns

void


Select a drawing, icon, or a cursor. It's the same as clicking on the corresponding button in the left toolbar.

Signature

selectLineTool(linetool: SupportedLineTools, options?: EmojiOptions | IconOptions) => void

Parameters

NameTypeDescription
linetoolSupportedLineToolsA drawing or cursor to select.
options?EmojiOptions | IconOptionsAn optional object with options.

Returns

void


selectedLineTool

Get the currently selected drawing or cursor.

Signature

selectedLineTool() => SupportedLineTools

Returns

An identifier for drawing or cursor.

SupportedLineTools


setActiveChart

Set which chart is currently active. It is recommended that this method is only used when linked to a user action which should change the active chart.

Use chartsCount to determine the number of charts currently available. If an invalid index is supplied (less than zero, or greater than the number of charts minus 1) then this method will not change the active chart.

Signature

setActiveChart(index: number) => void

Parameters

NameTypeDescription
indexnumberindex of chart to set as the active chart. Index is zero-based.

Returns

void


setCSSCustomProperty

Sets the value for a CSS custom property.

Example:

widget.setCSSCustomProperty('--my-theme-color', '#123AAA');

Signature

setCSSCustomProperty(customPropertyName: string, value: string) => void

Parameters

NameTypeDescription
customPropertyNamestringA string representing the CSS custom property name. It is expected that the name should start with a double hyphen ('--').
valuestringA string containing the new property value.

Returns

void


setDebugMode

Enable or disable writing detailed Datafeed API logs into the browser console.

Signature

setDebugMode(enabled: boolean) => void

Parameters

NameTypeDescription
enabledbooleanA boolean flag. true to enable debug mode, false to disable.

Returns

void


setLayout

Set the current chart layout type.

Params

layout A string representation of the new layout type. E.g. '2h' for two charts split vertically.

Signature

setLayout(layout: LayoutType) => void

Parameters

NameType
layoutLayoutType

Returns

void


setSymbol

Set the symbol and resolution of the active chart.

Signature

setSymbol(symbol: string, interval: ResolutionString, callback: EmptyCallback) => void

Parameters

NameTypeDescription
symbolstringA symbol to load.
intervalResolutionStringA interval (resolution) to load.
callbackEmptyCallbackA callback. Called when the symbol's data has finished loading.

Returns

void


showConfirmDialog

Show a dialog with custom title and text along with "OK" and "CANCEL" buttons.

Signature

showConfirmDialog(params: DialogParams<Function>) => void

Parameters

NameTypeDescription
paramsDialogParams<(confirmed: boolean) => void>A object of options for the created dialog.

Returns

void


showLoadChartDialog

Show the "Load Chart Layout" dialog.

Signature

showLoadChartDialog() => void

Returns

void


showNoticeDialog

Show a dialog with custom title and text along with an "OK" buttons.

Signature

showNoticeDialog(params: DialogParams<Function>) => void

Parameters

NameTypeDescription
paramsDialogParams<() => void>A object of options for the created dialog.

Returns

void


showSaveAsChartDialog

Show the "Copy Chart Layout" dialog.

Signature

showSaveAsChartDialog() => void

Returns

void


startFullscreen

Set the chart into fullscreen mode (if it isn't already).

Signature

startFullscreen() => void

Returns

void


subscribe

Subscribe to library events.

Signature

subscribe<EventName>(event: EventName, callback: SubscribeEventsMap[EventName]) => void

Type parameters

NameType
EventNameextends keyof SubscribeEventsMap

Parameters

NameTypeDescription
eventEventNameA event to subscribe to.
callbackSubscribeEventsMap[EventName]A callback that will be called when the event happens.

Returns

void


supportedChartTypes

This method returns a readonly WatchedValue (IWatchedValueReadonly) object that can be used to read/watch the current supported chart types (SeriesType) for an active chart.

The chart type is returned as a number. You can see which number corresponds to which chart type in the Overrides documentation for mainSeriesProperties.style.

Signature

supportedChartTypes() => IWatchedValueReadonly<ChartStyle[]>

Returns

IWatchedValueReadonly<ChartStyle[]>


symbolInterval

Get the symbol and interval of the active chart.

Signature

symbolInterval() => SymbolIntervalResult

Returns

SymbolIntervalResult


symbolSync

Only available in Trading Platform. Get a watched value that can be used to read/write/subscribe to the state of the symbol sync between charts.

Example

if (widget.symbolSync().value()) {
// ...
}

Signature

symbolSync() => IWatchedValue<boolean>

Returns

A watched value of the state of the symbol sync.

IWatchedValue<boolean>


takeClientScreenshot

Create a snapshot of the chart and return it as a canvas. Use this method to implement your logic for taking snapshots.

Signature

takeClientScreenshot(options?: Partial<ClientSnapshotOptions>) => Promise<HTMLCanvasElement>

Parameters

NameTypeDescription
options?Partial<ClientSnapshotOptions>An optional object that customizes the returned snapshot.

Returns

A promise containing a HTMLCanvasElement of the snapshot.

Promise<HTMLCanvasElement>


takeScreenshot

Create a snapshot of the chart and upload it to the server. When it is ready callback functions subscribed to the 'onScreenshotReady' event using subscribe will be called. The URL of the snapshot will be passed as an argument to the callback function.

Signature

takeScreenshot() => void

Returns

void


timeHoursFormat

Get a watched value that can be used to read/write/subscribe to the state of the timeHours format.

Signature

timeHoursFormat() => IWatchedValue<TimeHoursFormat>

Returns

IWatchedValue<TimeHoursFormat>


timeSync

Only available in Trading Platform. Get a watched value that can be used to read/write/subscribe to the state of the time sync between charts.

Example

widget.timeSync().setValue(true);

Signature

timeSync() => IWatchedValue<boolean>

Returns

A watched value of the state of the time sync.

IWatchedValue<boolean>


undoRedoState

Get the state of the undo/redo stack.

Signature

undoRedoState() => UndoRedoState

Returns

UndoRedoState


unloadUnusedCharts

This method deletes non-visible charts from a multiple-chart layout.

When a user transitions from a layout with a larger number of charts to one with fewer charts, the unused chart APIs still exist behind the scenes. This inherent behavior allows the library to restore previously displayed charts.

If you prefer that additional charts are displayed as new, with no record of previous charts at the same position, you can use this method to delete all non-visible charts. It is most effective to run this method right after a layout change (one can subscribe to SubscribeEventsMap.layout_changed to know when this occurs).

Please ensure that any subscriptions or event listeners associated with the hidden charts are removed prior to invoking this method.

Signature

unloadUnusedCharts() => void

Returns

void

void


unsubscribe

Unsubscribe from library events.

Signature

unsubscribe<EventName>(event: EventName, callback: SubscribeEventsMap[EventName]) => void

Type parameters

NameType
EventNameextends keyof SubscribeEventsMap

Parameters

NameTypeDescription
eventEventNameA event to unsubscribe from.
callbackSubscribeEventsMap[EventName]A callback to unsubscribe. Must be the same reference as a callback passed to subscribe.

Returns

void


watchList

Trading Platform only. Get a promise that resolves with an API object for interacting with the widgetbar (right sidebar) watchlist.

Example

const watchlistApi = await widget.watchList();
const activeListId = watchlistApi.getActiveListId();
const currentListItems = watchlistApi.getList(activeListId);
// append new section and item to the current watchlist
watchlistApi.updateList(activeListId, [...currentListItems, '###NEW SECTION', 'AMZN']);

Signature

watchList() => Promise<IWatchListApi>

Returns

An API object for interacting with the widgetbar (right sidebar) watchlist.

Promise<IWatchListApi>


watermark

Get an API object for adjusting the watermarks present on the charts. This can only be accessed when the chart is ready to be used. (onChartReady)

Signature

watermark() => IWatermarkApi

Returns

An API object for adjusting the watermark settings.

IWatermarkApi


widgetbar

Trading Platform only. Get a promise that resolves with an API object for interacting with the widgetbar (right sidebar).

Signature

widgetbar() => Promise<IWidgetbarApi>

Returns

An API object for interacting with the widgetbar (right sidebar).

Promise<IWidgetbarApi>