8.0.0 to 8.1.0

Version 8.1.0 sunsets jQuery in library code, introduces the Table View add-on, and enables multiple instances of the Trade from Chart plug‑in.

jQuery

The jQuery framework is no longer required by the library. Previously used jQuery functions have been replaced by ChartIQ functions (see the 8.1.0 release notes). You can still use jQuery for your own custom code; just include the jQuery framework in your application's HTML files.

Table View add-on

The new Table View add-on can be referenced from the configuration object returned by the getDefaultConfig function of js/defaultConfiguration.js, for example:

import getDefaultConfig from "./js/defaultConfiguration.js";

const config = getDefaultConfig({
	markerSample: marker.MarkersSample,
	scrollStyle: PerfectScrollbar,
	quoteFeed: quotefeed,
	forecastQuoteFeed: forecastfeed
});

config.addOns.tableView.minColumnWidth = "300px" // Units must be included.

The add-on is enabled by default. See:

enabledAddOns: {
    extendedHours: true,
    fullScreen: true,
    inactivityTimer: true,
    rangeSlider: true,
    tableView: true
}

in js/defaultConfiguration.js.

The table view's component communication channel is channels.tableView.

The table view can be opened using the Alt+K keystroke combination and closed using the Escape key. You can customize the keystroke combination; see the tableView action in hotkeyConfig.hotkeys in js/defaultConfiguration.js.

Trade from Chart

The Trade from Chart (TFC) plug-in now works on multiple charts displayed on the same web page. A new CIQ.Account#getPoller function returns a poller that synchronizes account positions, account value, and open orders on all TFC instances on the page.

CIQ.Account#getPoller replaces the CIQ.Account.prototype.Poller property definition formerly in plugins/tfc/tfc.js. The CIQ.Account constructor function assigns the return value of getPoller to the Poller property of CIQ.Account instances. Because CIQ.Account provides the prototype object of derived custom account objects, you can reference the poller returned by getPoller the same way you referenced the old Poller property, for example:

CIQ.Account.MyAccount.prototype.Poller.intervals = {...};

Implementation

To enable the 8.1.0 version of TFC, you must provide a custom CIQ.Account for the plug-in. The tfc-demo.js file in the plugins/tfc folder creates a sample custom account, CIQ.Account.Demo. You can include the demo account in your applications by importing tfc-demo.js as follows:

import "./plugins/tfc/tfc-demo.js";

Templates

Uncomment the following lines in technical-analysis-chart.html and sample-template-multi-charts.html to enable the Trade from Chart plug-in along with the sample account:

//import "./plugins/tfc/tfc-loader.js";
//import "./plugins/tfc/tfc-demo.js"; /* if using demo account class */

sample-template-active-trader.html

The sample-template-active-trader.html template takes care of everything for you. The template implements the Trade from Chart plug‑in by default; and so, includes the following statement:

import "./plugins/tfc/tfc-demo.js";

The TFC plug-in is loaded in the activetrader.js file (in the plugins/activetrader folder) by the following import:

import "../../plugins/tfc/tfc-loader.js";

Configuration

Add your own custom CIQ.Account by setting the account as the value of the account property of the tfc plug‑in referenced by the configuration object returned from defaultConfiguration.js, for example:

import "./plugins/tfc/tfc-loader.js";
import getDefaultConfig from "./js/defaultConfiguration.js";

const config = getDefaultConfig({
	markerSample: marker.MarkersSample,
	scrollStyle: PerfectScrollbar,
	quoteFeed: quotefeed,
	forecastQuoteFeed: forecastfeed
});

config.plugins.tfc.account = YourCustomCIQAccount; // Can also be a reference to a constructor that creates a custom account.

React

The chartiq-react-app project on GitHub has been improved significantly as part of the 8.1.0 release. The previous version of the app wrapped each web component individually in a React component; the new version wraps all of the web components into several composite UI React components. See the README for more information about the new components.

Note: The app is also compatible with version 8.0.0 of the library.

App configuration is now contained in the defaultConfiguration.js file in node_modules/chartiq/js. Move your configuration settings from the _config.js file in the src/chartiq folder to defaultConfiguration.js. The structure of the config objects in the two files is similar.

See the README for information about adding the AdvancedChart component to your React applications. Contact support@chartiq.com for help with upgrading source code customizations you've made to AdvancedChart.

webpack

The library's example webpack files have been reorganized into a webpack-example folder located in the root folder of the library. See the 8.1.0 release notes for a full description of the folder contents.