ChartIQ SDK Documentation Class: Chart

new Chart()

The Chart class contains a collection of methods used to instantiate and configure charts and the chart user interface.

The createChart method creates the chart engine, add-ons, market definitions, and storage functions. The createUI method creates and configures the user interface, helpers, plug-ins, and event markers.

The remaining methods are supporting methods that can be customized by extending the Chart class.

The decisions on what to initiate and how it gets initiated are based on the provided configuration object and the availabilty of resources loaded in the CIQ namespace.

Since:

7.5.0

Methods

breakpointSetter(uiContext)

Returns a setter that updates the responsive break point of the top node of the chart user interface context.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

Returns:

A function that sets the responsive break point of the UI context.

Type: function

chartAreaTopSetter(uiContext)

Returns a setter that updates the top position of the chart area (the HTML element that has the CSS class ciq-chart-area) based on the height of the Trading Central and Technical Insights (Recognia) plug-ins. The height of the plug-ins is read from the tcHeight and recogniaHeight channels, respectively.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

Returns:

A function that sets the top position of the chart area.

Type: function

chartPositionSetter(uiContext)

Returns a setter function that updates the size of the side navigation panel by positioning the chart container div.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

Returns:

A function that sets the size of the side navigation panel.

Type: function

createChart(container [, config])

Creates the chart engine, attaches quote feeds, and initiates add-ons and the L2 simulation in container with the configuration specified by config. If a configuration is not provided, a default configuration is applied.

Parameters:

Name Type Argument Default Description

container

HTMLElement

The HTML element in which the chart engine is created.

config

Object

null

Contains configuration specifications.

Properties

Name	Type	Argument	Description
`chartEngineParams`	Object	<optional>	Parameters required by the CIQ.ChartEngine constructor except for a reference to the container HTML element, which is provided by `container`.
`quoteFeeds`	Object	<optional>	Array of quote feed objects.
`marketFactory`	Object	<optional>	Market factory object. When not provided, CIQ.Market.Symbology.factory is used if available.
`addOns`	Object	<optional>	Initialization properties for add-ons.
`simulateL2`	function	<optional>	Function to run the L2 data simulation.

Since:

7.5.0

Returns:

A reference to the chart engine.

Type: CIQ.ChartEngine

createChartAndUI(container, config)

Creates the chart engine and user interface, including the UI context.

Parameters:

Name	Type	Description
`container`	HTMLElement	The HTML element that hosts the user interface elements of the chart. The element is a `cq-context` element, or it contains a `cq-context` element or element with a `cq-context` attribute. The context element, in turn, contains a chart container element; that is, an element with class `chartContainer`.
`config`	Object	Configuration for the chart engine, UI elements, and plug-ins. See individual methods for configuration options.

Since:

7.5.0

Returns:

Type: CIQ.UI.Context

getBreakpoint(width)

Maps numeric widths to responsive break types. Break types include small (break-sm), medium (break-md), and large (break-lg).

Parameters:

Name	Type	Description
`width`	Number	The widht in pixels for which a break type is determined.

Since:

7.5.0

Returns:

The break type, one of break-sm, break-md, or break-lg.

Type: String

getKeystrokeHubSetter(uiContext, keystrokeHub)

Gets a callback that set the the active context of the keystroke hub based on the mouse pointer location.

When multiple charts are on a page, the chart with the mouse pointer over it responds to keyboard input, such as shortcuts or symbol entry.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.
`keystrokeHub`	CIQ.UI.KeystrokeHub	A reference to the keystroke hub.

Since:

7.5.0

Returns:

A callback that sets the active context of the keystroke hub.

Type: function

getSaveDrawings(config)

Captures configuration information to provide to the callback that saves the state of chart drawings.

Parameters:

Name	Type	Description
`config`	*	Contains the drawing state.

Since:

7.5.0

Returns:

A callback invoked to save the state of the chart drawings.

Type: function

getSaveLayout( [config])

Captures configuration information in the returned callback function.

Parameters:

Name	Type	Argument	Description
`config`	Object	<optional>	Should contain the chart ID, which is used to help identify the layout in local storage.

Since:

7.5.0

Returns:

A callback that stores the chart layout. Uses the chart ID in config (if provided) as part of the identifier of the saved layout in local storage.

Type: function

initColorPicker()

Creates and appends a cq-color-picker component to the document body if one is not already attached.

Since:

7.5.0

initContainerListeners(uiContext)

Initializes the chart container size change listener, channel subscriptions, and the keystroke hub and its focus management (see CIQ.UI.KeystrokeHub).

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initDialogHandler(uiContext)

Subscribes to the dialog channel.

Creates an element for the requested dialog if one does not exist in the document scope. Opens the dialog in response to channel messages.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initDrawingEditListeners(uiContext)

Creates a CIQ.UI.DrawingEdit helper and adds listeners to the helper. The listeners post messages in the drawing channel when drawing starts and ends.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initDrawingTools(uiContext)

Subscribes to the drawing channel to manage drawing tool visibility based on channel messages.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initEventMarkers(uiContext)

Initiates event marker functionality.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initExtensions(stx, uiContext, config, type)

Installs add-ons and plug-ins.

Parameters:

Name	Type	Description
`stx`	CIQ.ChartEngine	A reference to the chart engine.
`uiContext`	CIU.UI.Context	The chart user interface context.
`config`	Object	Contains the chart configuration, which includes a list of add-ons and a list of plug-ins.
`type`	String	Type of extension, either "addOns" or "plugins".

Since:

7.5.0

initKeystrokeHub(uiContext)

Attaches a CIQ.UI.KeystrokeHub to the body element to enable users to start typing anywhere on the page to activate the chart's symbol input box.

Modify this method to use a different tag, such as a div, if this behavior is too broad for your implementation.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initLookup(uiContext)

Creates a symbol change filter and attaches it to the chart UI context and lookup containers.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

initStorage(stx, config)

Initiates the storing of state on state changes.

Parameters:

Name	Type	Description
`stx`	CIQ.ChartEngine	A reference to the chart engine.
`config`	Object	Contains the state to be saved.

Since:

7.5.0

loadChart(uiContext)

Loads a chart with an initial symbol. When configured to restore the layout (which is the default), recreates the settings used in the previous session, including the last viewed symbol.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

notifySizeChanges(uiContext)

Event handler for chart container size changes. Posts messages in the breakpoint and containerSize channels when the context container size has changed.

Listening for container size changes in some browsers can be inefficient. This function improves notification efficiency by posting messages for specific changes, such as changes in responsive layout break points.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

restoreDrawings(stx, symbol [, id])

Restores the state of saved chart drawings.

Parameters:

Name	Type	Argument	Description
`stx`	CIQ.ChartEngine		A reference to the chart engine.
`symbol`	String		The chart symbol. Used to identify the saved state in local storage. Concatenated to `id` if `id` is provided.
`id`	String	<optional>	A unique local storage identifier for the saved drawings.

Since:

7.5.0

restoreLayout(stx, cb, id)

Restores the chart layout.

Parameters:

Name	Type	Description
`stx`	CIQ.ChartEngine	A reference to the chart engine.
`cb`	functon	A callback to be called when restoration of the layout is complete.
`id`	String	The storage identifier for the stored chart layout.

Since:

7.5.0

restorePreferences(stx [, id])

Restores the chart preferences.

Parameters:

Name	Type	Argument	Description
`stx`	CIQ.ChartEngine		A reference to the chart engine.
`id`	String	<optional>	A unique local storage identifier for the chart preferences.

Since:

7.5.0

retoggleEvents(stx)

Utility function that synchronizes marker state.

Parameters:

Name	Type	Description
`stx`	CIQ.ChartEngine	A reference to the chart engine.

Since:

7.5.0

savePreferences()

Saves the chart preferences.

Parameters:

Name	Type	Description
`params.stx`	CIQ.ChartEngine	A reference to the chart engine.

Since:

7.5.0

sidenavSizeSetter(uiContext)

Returns a setter that updates the width of the side navigation panel by positioning the chart area (the HTML element that has the CSS class ciq-chart-area).

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

Returns:

A function that sets the size of the side navigation panel.

Type: function

sidepanelSizeSetter(uiContext)

Returns a setter that updates the width of the side panel by setting the right position of the chart area (the HTML element that has the CSS class ciq-chart-area) and the right margin of the Trading Central plug-in, cq-tradingcentral.

Parameters:

Name	Type	Description
`uiContext`	CIQ.UI.Context	The chart user interface context.

Since:

7.5.0

Returns:

A function that sets the width of the side panel.

Type: function