Price legend collapse

API

Add to layout file , block  “collapselegend”

Where
collapseopen:false|true
Status for start show legend or hide

title_1and title_2
Symbol for show / hide legend

Mobile support

API

For best performance on mobile system , chart supports enabling off/on the following modules:

Off|On

Add to  “ProChart_InitLayout” event

 

Price as Area with Gradient Fill

Features

Starting from version 5.3.x it is possible to enable gradient fill for Area price-type.
It requires editing the relevant “chart.css.json.js for” file,  and adding a “fill2” and “fillOpacity” attributes with the required color and opacity.

You can locate the entry via price->area.

Solid fill:

 

Gradient fill version 5.3.x:

Gradient fill version 5.4.x:

stroke is the line color.
fill and fill2 are the gradient’s starting and ending colors.
fillOpacity is the gradient opacity.
fillOpacity2 is the gradient opacity for fill 2 (supported from version 5.4.0 and above).

 

Switch Expiration Mode

API

Expiry Mode

The “Expiration Mode” enables the Chart to stop data updates, based on a specified “expire” date. Any new data afterwards will not update the Chart.
In regular mode the Chart shifts the data to the left. In “Expiration Mode” the Chart fills from left to right, showing all the data including the future dates area.
The following API enables switching this mode ON or OFF on the fly.

 

StopExpiration
Disable expiration mode and reset buffers accordingly.

UpdateExpirationField
Update the expiration date and enable expiration mode if not already enabled.

API-Events

API
Events demo

Loader

LoaderInitComplete
Complete load the Chart’s library files

Chart (Layout)

readyComplete
Complete read all files for the layout

initComplete
Complete init all properties and objects for the layout

onFullPage
Event when the chart opens to full screen or not

onPreloadStart
Event when the “preload” (wait animation) start

onPreloadFinished
Event when the “preload” (wait animation) finished

Chart object

createComplete
The chart object is successfully created and ready to work

onChangeMajorsFavorites
Change majors favorites in the chart

onChangeComparesFavorites
Change compares favorites in the chart

onChangeIndicatorsFavorites
Change indicators favorites in the chart

onChangeSymbol
Change current symbol in the chart

onChangeTimeframe
Change current timeframe in the chart

onTimeZoneChanged
Change current time zone in the chart

onPriceTypeChange
Change current price type in the chart

onLastUpdateChange
The event occurs when the data is updated

Chart (Shape)

onStartDrawing
The event happens when we start drawing a shape

onStopDrawing
The event occurs when we have finished drawing a shape

onDeleted
The event occurs when we delete a shape

onSelectChange
An event occurs when we select another shape

onEndDrag
The event occurs when we finish moving the shape

onEndSize
The event occurs when we finish moving the resizing of the shape

onDeleted
The event occurs when we have already deleted the figure

Chart (Study|Indicators)

onUpdated
The event occurs when we change the parameters in the indicator

onAdded
The event occurs when the indicator is added

onDeleted
The event occurs when we delete the indicator

Loclization

onChange
The event occurs when the language changes

Version 5.3.3

Features, Versions

Updates:

  • Added more events callback for Shape and Indicators to notify on adding, modifying, dragging and resizing.
    Can be used to collect BI or persist user state after each change.

Change Size

API

 

Version 5.3.2

Features, Versions

New Features:

  • Responsive Mode.
    A new property objChartMain3.apiinit.parentRelativeObjectID enables referencing a relative parent for automatic resizing.
    This feature is mainly for responsive web platforms, which embed the Chart inside an internal container.
    The Chart will resize to accommodate new real-estate size among the rest of the page containers.

 

  • Light Mode.
    This feature offers a solution for reducing loading file size signature, by marking the none required modules.

     

Custom timeframes

API, Features

How-to create custom timeframe?

Toolbar

1st step

Add to layout file ( until version 5.3.1 ) property “timeframeview”

2 step:
Change time scale properties in html

Menu

Layout file , object menu

Drop-down toolbar

Layout file , object toolbar