ChartIQ SDK Legacy Documentation

Base namespace for STX library

Classes

Account
Drawing
DrawingToolbar
EaseMachine
ExtendedHours
LookupWidget
Marker
Market
Plotter
QuoteFeed
Quotes
Renderer
TFC
Tooltip
Views
Watch

Namespaces

Comparison
DialogManager
I18N
MenuManager
StorageManager
Studies
ThemeManager
TimeZoneWidget

Members

<static> colorPickerColors

Predefined colors for the color picker that have been tested across multiple devices. These color values may be changed if desired by assigning STX.colorPickerColors to a different array of colors.

Example

STX.colorPickerColors = ["ffffff","ffd0cf","ffd9bb","fff56c","eaeba3","d3e8ae","adf3ec","ccdcfa","d9c3eb"];

<static> FibDialog

Initializes and interacts with the settings tool for fibonacci

<static> iscroll

Namespace for managing iscrolls (scrollable elements by touch of mousewheel).

<static> privateBrowsingAlert

Set once after user is alerted that private browsing is enabled

<static> ScrollManager

ScrollManager

This is a widget for detecting whether a user has scrolled between the time that they press the mouse and let go. Otherwise the act of scrolling a dialog would cause a selection of items in the dialog. To use, register start as your mousedown or touchstart event. Then call isClick(e) during your mouseup or touchend event to determine whether the user truly clicked or not.

Methods

<static> addMemberToMasterdata(stx [, label], data [, fields] [, createObject] [, fieldForLabel])

Convenience function to iterate through the charts masterData and add a data member. Generally used for additional comparison or study symbols. Can be used with any array of data objects which contains at least the 'DT' (date in javascript format) and 'Close' ( close/last price ) elements of an OHLC object. The data member will be the string defined by "label". Dates must be exact matches (minutes, hours, seconds, milliseconds) in order to show up in comparisons.

Parameters:

Name	Type	Argument	Description
`stx`	STXChart		A chart object
`label`	String	<optional>	The new member name to add to masterData. masterData[label]=data["Close"]. Required unless "fields" is specified.
`data`	Array		The data to add (which should align or closely align with the chart data by date)
`fields`	Array	<optional>	The fields from the data objects to extract (as opposed to "Close") and add to the new label member. One label member will be added per field. Takes precedence over `createObject` flag.
`createObject`	Boolean	<optional>	If true, then data elements from the data array are added as objects assigned to the label. Example: member[label]=data[element]; This behavior is mutually exclusive with `fields`.
`fieldForLabel`	String	<optional>	If set, this will be the field from data copied into label, if not set, Close is used; This behavior is mutually exclusive with `fields`.

Since:

15-07-01 fieldForLabel argument

Example

//data element format if neither fields nor createObject are used
{DT:epoch,Date:strDate,Close:value}
//data element format if fields is used
{DT:epoch,Date:strDate,Field1:value,Field2:value,Field3:value,Field4:value}
//data element format if createObject is used
{DT:epoch,Date:strDate,AnyOtherData:otherData,MoreData:otherData,...}

<static> alert(text)

User friendly alerts. The charting engine always uses this instead of alert() for warning or error messages. This method can be overriden as required by your user interface.

Parameters:

Name	Type	Description
`text`	string	Alert message

Example

// Override with a friendlier alert mechanism!
STX.alert=function(text){
	doSomethingElse(text);
}

<static> appendClassName(node, className)

Appends a class name to a node if it isn't already there. This is frequently used to control dynamic behavior via CSS.

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`className`	string	Name of class to add to the DOM element

Example

// Apply an "active" css look to an object
STX.appendClassName(myNode, "active");

<static> attachColorPicker(colorClick, cpHolder, cb)

Attaches a color picker to a DOM object.

Parameters:

Name	Type	Description
`colorClick`	object	The DOM element that the user clicks on to pull up the color picker. The color picker will set the background color of this node to the selected color.
`cpHolder`	object	A global object that is necessary to contain the color picker and handle closures. Usually the parent of colorClick.
`cb`	function	A callback function to call when the color is picked of format fc(color) where color is the selected color

<static> boxIntersects(bx1, by1, bx2, by2, x0, y0, x1, y1, vtype)

Determines whether a line intersects a box. This is used within the charting engine to determine whether the cursor has intersected a drawing.

Parameters:

Name	Type	Description
`bx1`	number
`by1`	number
`bx2`	number
`by2`	number
`x0`	number
`y0`	number
`x1`	number
`y1`	number
`vtype`	string	Either "segment", "ray" or "line"

Returns:

Returns true if the line intersects the box

Type: boolean

<static> calculateHeikinAshi(stx, dataSet)

Calculates Heikin-Ashi values. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`dataSet`	array	The dataSet to modify

Version:

ChartIQ Advanced Package

Since:

04-2015-15

Returns:

The replacement dataSet

Type: array

<static> calculateKagi(stx, dataSet, reversal)

Calculates Kagi chart values. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`dataSet`	array	The dataSet to modify
`reversal`	number	The reversal percentage for the kagi lines. This is typically user configurable. Default is 4% for daily, .4% for intraday.

Version:

ChartIQ Advanced Package

Since:

04-2015-15

Returns:

The replacement dataSet

Type: array

<static> calculateLineBreak(stx, dataSet, pricelines)

Calculates Line Break chart values. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`dataSet`	array	The dataSet to modify
`pricelines`	number	The number of lines to use for the line break count. This is typically user configurable. Default is 3.

Version:

ChartIQ Advanced Package

Since:

04-2015-15

Returns:

The replacement dataSet

Type: array

<static> calculatePointFigure(stx, dataSet, pandf)

Calculates Point and Figure (P&F) chart values. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name Type Description

stx

STXChart

The chart object

dataSet

array

The dataSet to modify

pandf

object

The parameters for point and figure.

Properties

Name	Type	Argument	Description
`box`	number	<optional>	The box size. Default is automatically determined based on the price.
`reversal`	number	<optional>	The reversal amount, in boxes. Default is 3.

Version:

ChartIQ Advanced Package

Since:

04-2015-15

Returns:

The replacement dataSet

Type: array

<static> calculateRangeBars(stx, dataSet, range)

Calculates range bars. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`dataSet`	array	The dataSet to modify
`range`	number	The price range for the range bars. This is typically user configurable. Defaults to 300 bars; about a year for a daily chart, about 5 hours on a minute chart.

Version:

ChartIQ Advanced Package

Returns:

The replacement dataSet

Type: array

<static> calculateRenkoBars(stx, dataSet, range)

Calculates Renko bars. Takes a dataSet and returns a replacement dataSet. This method is used inside STXChart#createDataSet to determine the data aggregation logic and should not be called directly. Use STXChart#setAggregationType instead.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`dataSet`	array	The dataSet to modify
`range`	number	The price range for the renko bars. This is typically user configurable. Defaults to 300 bars; about a year for a daily chart, about 5 hours on a minute chart.

Version:

ChartIQ Advanced Package

Returns:

The replacement dataSet

Type: array

<static> calculateTradingDecimalPlaces(params)

Determines how many decimal places the security trades. This is a callback from STXChart.calculateTradingDecimalPlaces and you can override this with your own functionality. The default algorithm is to check the most recent 50 quotes and find the maximum number of decimal places that the stock has traded. This will work for most securities but if yourmarket data feed has rounding errors or bad data then you may want to supplement this algorithm that checks the maximum value by security type.

Parameters:

Name Type Description

params

Object

Parameters

Properties

Name	Type	Description
`stx`	STXChart	The chart object
`chart`	STXChart.Chart	The chart in question
`symbol`	Object	The symbol object. If you create charts with just stock symbol then symbolObject.symbol will contain that symbol

Returns:

The number of decimal places

Type: Number

<static> chooseForegroundColor(backgroundColor)

Chooses either a white or black foreground color depending on the "value" of the background color. Note that this simply checks if the value is above .85 which works well but not ideally for red colors which the human eye interprets differently. More complex algorithms are available but chartists rarely use red as a background color.

Parameters:

Name	Type	Description
`backgroundColor`	string	The background color (CSS format)

Returns:

Either #000000 (black) or #FFFFFF (white) depending on will look best on the given background color

Type: string

<static> clearCanvas(canvas [, stx])

Animation Loop Clears the canvas. Uses the fastest known method except on the legacy Android browser which had many problems!

Parameters:

Name	Type	Argument	Description
`canvas`	object		A valid HTML canvas object
`stx`	object	<optional>	A chart object, only necessary for old Android browsers on problematic devices

<static> clearNode(node)

Removes all DOM elements in a given node. This is extremely useful when dynamically generating content.

Parameters:

Name	Type	Description
`node`	object	The node to clear

<static> clearSafeClickTouches(div)

Clears all safeClickTouch events from a DOM element.

Parameters:

Name	Type	Description
`div`	object	The DOM element to clear events

<static> clone(from [, to])

Clones an object. This function creates a deep (recursive) clone of an object. The object can be a primitive or an object or an array. Note that cloning objects that reference DOM nodes can result in stack overflows. Use with caution.

Parameters:

Name	Type	Argument	Description
`from`	object		The source object
`to`	object	<optional>	Optional existing object of same type. Can improve performance when objects are reusable.

Returns:

A deep clone of the "from" object

Type: object

<static> colorToHex(color)

Converts an rgb or rgba color to a hex color

Parameters:

Name	Type	Description
`color`	string	The rgb or rgba color, such as in CSS format

Returns:

The hex color. If "transparent" or no color is sent in, #000000 will be assumed

Type: string

Example

var hexColor=STX.colorToHex("rgba (255,255,255,0.3)");

<static> commas(val)

Returns a string representation of a number with commas in thousands, millions or billions places. Note that this function does not handle values with more than 3 decimal places!!!

Parameters:

Name	Type	Description
`val`	number	The value

Returns:

The result with commas

Type: string

Example

// Returns 1,000,000
STX.commas(1000000);

<static> computeEquationChart(equation, map)

Computes an equation that may contain symbols and simple arithmetic operators. Parentheses can be used to separate portions of the equation. PEMDAS priority is observed. Symbols can be optionally contained within brackets. Valid examples: 3IBM, 4+(IBM2), (IBM-GM)/2 If the equation cannot be resolved an exception is thrown.

Parameters:

Name	Type	Description
`equation`	string	The equation to compute.
`map`	Object	An map of symbols to data

Version:

ChartIQ Advanced Package

Returns:

A consolidated array of equation results

Type: Array

<static> condenseInt(txt)

Condenses an integer into abbreviated form by adding "k","m","b" or "t". This method is used in the y-axis for example with volume studies.

Parameters:

Name	Type	Description
`txt`	number	A numerical value

Returns:

Condensed version of the number

Type: string

Example

// This will return 12m
condentInt(12000000);

<static> convertClickToTouchEnd(id)

Converts an onClick event to an ontouchend event. If the device is known to be a touch device then this can be used to change onclick events that are set as attributes (in HTML). ontouchend events are more responsive than onclick events and can improve the user experience. When coding for cross-device implementations it is recommended to use @see STX.safeClickTouch programatically rather than using hardcoded attributes

Parameters:

Name	Type	Description
`id`	string	The id of a node containing an onClick attribute

<static> convertCurrencyCode(code)

Converts a currency code from ISO to char

Parameters:

Name	Type	Description
`code`	string	The string to convert, e.g. USD

Returns:

The converted string, e.g. $

Type: string

<static> convertFutureMonth(x)

Converts a future month to the month index or vice versa. Month indexes begin with 1 for January

Parameters:

Name	Type	Description
`x`	char	The value to convert. If numeric, will convert to Future month letter. If Alpha, will convert to month index.

Returns:

Converted value

Type: char

<static> convertTimeZone(dt, originalTimeZone, targetTimeZone)

Converts a Date object from one time zone to another using the timezoneJS.Date library

Parameters:

Name	Type	Description
`dt`	Date	Original JavaScript Date object, from the original time zone
`originalTimeZone`	string	The original time zone
`targetTimeZone`	string	The target time zone

Returns:

The date in the target timezone. This behaves the same as a native Date.

Type: timezoneJS.Date

<static> convertToLocalTime(dt, originalTimeZone)

This method converts a time from another timezone to local time on the browser

Parameters:

Name	Type	Description
`dt`	Date	The original time
`originalTimeZone`	string	A valid timezone

Returns:

The date converted to local time

Type: Date

<static> createMonthArrays(stx, formatter, locale)

Extract the name of the month from the locale. We do this by creating a localized date for the first date of each month. Then we extract the alphabetic characters. MonthLetters then becomes the first letter of the month. Note that in the current Intl.js locale, chinese and japanese months are implemented as 1月 through 12月 which causes this algorithm to fail. Hopefully real months will be available when Intl becomes a browser standard, otherwise this method or the locale will need to be modified for those or other special cases. The arrays are stored in stx.monthAbv and stx.monthLetters which will then override the global arrays STX.monthAbv and STX.monthLetters.

Parameters:

Name	Type	Description
`stx`	object	Chart object
`formatter`	object	An Intl compatible date formatter
`locale`	string	A valid Intl locale, such as en-IN

<static> debug(str)

Sends debug output to debugger window when a console is not available. @see STX.openDebugger

Parameters:

Name	Type	Description
`str`	string	Data to print to debug window

<static> derivedFrom(parent)

Replacement for isPrototypeOf and instanceof so that both types of inheritance can be checked

Parameters:

Name	Type	Description
`parent`	Object	Prototype

Since:

07/01/2015

Returns:

True if the object is derived from the parent

Type: boolean

<static> deriveFromObjectChain(base, extension)

Given a dot notation string, we want to navigate to the location in a base object, creating the path along the way

Parameters:

Name	Type	Description
`base`	Object	Base object.
`extension`	String	String in dot notation

Since:

2015-11-1

Returns:

A tuple containing obj and member

Type: Object

Example

var tuple=STX.deriveFromObjectChain(stx.layout, "pandf.box");
tuple.obj===stx.layout.pandf
tuble.member==="box"
tuple.obj[tuple.member]="square";  // stx.layout.pandf.box="square"

<static> destroy(stx, excludedSelector)

Convenience function to destruct a chart window and related GUI (STX.ThemeManager, STX.MenuManager), eliminating all references and dependencies, and optionally its containing DOM element.

Please note that this call will destroy the menu manager and theme manager even if multiple charts are registered to them, in which case you must manually call the destroy() method for the remaining charts.

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object to destroy
`excludedSelector`	string	If passed then any top level object within chartContainer which matches this selector will not be deleted (and neither will the wrapper)

Since:

07/01/2015

<static> drawLegend(stx, params)

Draws a legend for the series that are displayed on the chart.

Parameters:

Name Type Description

stx

STXChart

The chart object to draw

params

object

parameters for drawing the legend

Properties

Name	Type	Argument	Description
`chart`	STXChart.Chart	<optional>	The chart object
`legendColorMap`	object	<optional>	A map of series names to colors and display symbols ( example IBM:{color:'red', display:'Int B M'} )
`coordinates`	object	<optional>	Coordinates upon which to draw the items, in pixels relative to top left of panel ( example {x:50, y:0} ). If null, uses chart.legend
`noBase`	boolean	<optional>	Set to true to not draw the base (the chart symbol's color) in the legend

<static> drawLegendItem(stx, xy, label, color)

Draws an item in the legend and returns the position for the next item

Parameters:

Name	Type	Description
`stx`	STXChart	The chart object
`xy`	array	An X,Y tuple (from chart.legend)
`label`	string	The text to print in the item
`color`	string	The color for the background of the item

Returns:

A tuple containing the X,Y position for the next the item

Type: array

<static> fetchEquationChart(params, cb)

Extracts symbols from an equation and fetches the quotes for them.

Parameters:

Name	Type	Description
`params`	object	Parameters used for the fetch
`cb`	function	Callback function once all quotes are fetched

Version:

ChartIQ Advanced Package

<static> fillTransparentCanvas(context, color, width, height)

Sets the transparent parts of the canvas to the specified background color. Used to ensure a background when turning charts into images because normally the background is the background of the DIV container and not the canvas itself.

Parameters:

Name	Type	Description
`context`	object	An HTML canvas context
`color`	string	The color to set the background. Any valid HTML canvas color.
`width`	number	Width to apply color (Could be less than size of canvas)
`height`	number	Height to apply color (Could be less than size of canvas if applying branding for instance)

<static> findNodesByText(startNode, text)

Find all nodes that match the given text. This is a recursive function so be careful not to start too high in the DOM tree.

Parameters:

Name	Type	Description
`startNode`	object	A valid DOM element from which to start looking
`text`	string	The text to search for

Returns:

An array of nodes that match the text

Type: array

<static> first(o)

Convenience function returns the first property in an object. Note that while this works in all known browsers the EMCA spec does not guarantee that the order of members in an object remain static. This method should therefore be avoided. When ordering is important use an Array!

Parameters:

Name	Type	Description
`o`	object	A JavaSCript object

Returns:

The first element in the object or null if it is empty

Type: object

<static> fixPrice(price)

Given a numeric price that may be a float with rounding errors, this will trim off the trailing zeroes

Parameters:

Name	Type	Description
`price`	Float	The price

Returns:

The price trimmed of trailing zeroes

Type: Float

<static> fixScreen()

Fixes screen scroll. This can occur when the keyboard opens on an ipad or iphone.

<static> focus(node, useTimeout)

Microsoft surface bug requires a timeout in oreder for the cursor to show up in a focused text box. iPad also, sometimes, when embedded in an iframe, so set useTimeout if in an iframe!

Parameters:

Name	Type	Description
`node`	object	A DOM element to focus
`useTimeout`	number	Whether to apply a timeout or not. If number then the number of milliseconds.

<static> formatEquation(equation)

Extracts symbols from an equation. An equation can consist of symbols and the following operators: +-/*%() PEMDAS order is followed. Additionally, symbols can be enclosed in brackets [] to treat them as literal non-parseables.

Parameters:

Name	Type	Description
`equation`	string	The equation to parse (e.g. IBM+GE)

Version:

ChartIQ Advanced Package

Returns:

Parsed equation, {equation: [formatted equation], symbols: [array of symbols found in the equation]}

Type: object

<static> friendlyDate(dt)

Converts a date into yyyy/mm/dd hh:mm format

Parameters:

Name	Type	Description
`dt`	date	A JavaScript Date object

Returns:

Date in yyyy/mm/dd hh:mm format

Type: string

<static> fromET(est)

Converts a JavaScript date from Eastern Time Zone to the browser's local time zone. Daylight Savings Time is hard coded. @see STX.getETDateTime

Parameters:

Name	Type	Description
`est`	date	JavaScript Date object representing a date/time in eastern time zone

Returns:

JavaScript Date object converted to browser's local time zone

Type: date

<static> getAjaxServer(url)

Gets an Ajax server dependent on browser method. If IE9 and a cross domain request then XDomainRequest() will be used rather than XMLHttpRequest.

Parameters:

Name	Type	Description
`url`	string	The url to connect with

Returns:

An ajax server

Type: object

<static> getETDateTime()

Gets the current time in Eastern Time Zone. This can be used as a convenience for determining open and closing times of US markets.

Returns:

JavaScript Date representing the time in Eastern Time Zone

Type: date

<static> getEventDOM( [e])

Get the source element for a DOM event depending on browser type

Parameters:

Name	Type	Argument	Description
`e`	object	<optional>	Event if available from browser

Returns:

The DOM node that registered the event

Type: object

<static> getHostName(url)

Returns the host portion of a url

Parameters:

Name	Type	Description
`url`	string	The url, such as document.location.href

Returns:

The host portion, including port, if the url is a valid URI

Type: string

<static> getLines(ctx, phrase, l)

Turns a portion of raw text into multi-line text that fits in a given width. This is used for autoformatting of annotations

Parameters:

Name	Type	Description
`ctx`	object	A valid HTML Canvas Context
`phrase`	string	The text
`l`	number	The width in pixels to fit the text within on the canvas

Returns:

An array of individual lines that should fit within the specified width

Type: array

<static> getPos(el)

Gets the absolute screen position of a nested DOM element. This is useful if you need to position additional elements or canvas elements relative to a nested DOM element.

Parameters:

Name	Type	Description
`el`	object	A valid DOM element

Returns:

{x,y} absolute screen position of the nested element

Type: object

<static> getYearDay( [dt])

Gets the day of the year

Parameters:

Name	Type	Argument	Description
`dt`	Date	<optional>	optional The date to check. If omitted, will use the current date.

Returns:

Day of year

Type: number

<static> hasClassName(node, className)

Returns true if a class name is currently assigned to the DOM node

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`className`	string	The class name to search for

Returns:

True if the class name is currently assigned to the DOM node

Type: Boolean

<static> hexToRgba(color, opacity)

Converts color to rgba. This does not accept literal color names such as "black"

Parameters:

Name	Type	Description
`color`	string	The hex rgb or rgba color, such as in CSS format
`opacity`	number	The 'alpha' value. Defaults to full opacity (100%)

Returns:

The rgba color

Type: string

Example

var rgba=STX.hexToRgba('rgb(0, 115, 186)');
var rgba=STX.hexToRgba('#0073BA');

<static> hideByText(startNode, text)

Hide nodes that match a certain text string.

Parameters:

Name	Type	Description
`startNode`	object	A valid DOM element from which to start looking
`text`	string	The text to match against STX.findNodesByText

<static> hideKeyboard(newFocus)

Closes the keyboard on a touch device by blurring any active input elements.

Parameters:

Name	Type	Description
`newFocus`	HTMLElement	optional element to change focus to

<static> hsv(color)

Converts a color from hex or rgb format to Hue, Saturation, Value. This does not accept literal color names such as "black"

Parameters:

Name	Type	Description
`color`	string	The color (from CSS)

Returns:

[Hue, Saturation, Value], or null if invalid color.

Type: array

<static> innerHTML(node, html)

Microsoft RT disallows innerHTML that contains DOM elements. Use this method to override when necessary.

Parameters:

Name	Type	Description
`node`	object	A valid DOM element to change innerHTML
`html`	string	The html text to change

Example

STX.innerHTML(node, "My innerHTML contains <span>a span</span> and MS RT doesn't like that");

<static> inputKeyEvents(node, cb)

Captures enter key events. Also clears the input box on escape key.

Parameters:

Name	Type	Description
`node`	object	The DOM element to attach the event to. Should be a text input box.
`cb`	function	Callback function when enter key is pressed.

<static> inspectProperties(theObject)

Prints all the properties of an object to the debug window. Similar to console.log(obj)

Parameters:

Name	Type	Description
`theObject`	object	The object to inspect

<static> intersectLineLineX()

Get the X intersection point between two lines

<static> intersectLineLineY()

Get the Y intersection point between two lines

<static> isDST( [dt])

DST checker. Returns whether input date is in DST

Parameters:

Name	Type	Argument	Description
`dt`	Date	<optional>	optional The date to check. If omitted, will use the current date.

Returns:

True for DST, false for not.

Type: boolean

<static> isEmpty(o)

Returns true if an object has no members

Parameters:

Name	Type	Description
`o`	object	A JavaScript object

Returns:

True if there are no members in the object

Type: Boolean

<static> isInElement(div, x, y)

Returns true if a point, in relative screen position, is withing an element @see STX.withinElement

Parameters:

Name	Type	Description
`div`	object	A valid DOM element
`x`	number	X point relative to DOM element nesting
`y`	number	Y point relative to DOM element nesting

Returns:

True if the point is in the element

Type: Boolean

<static> isTransparent(color)

Returns true if the color is transparent. In particular it checks rgba status. Note that the charting engine often interprets transparent colors to mean that a color should be automatically determined based on the brightness of the background.

Parameters:

Name	Type	Description
`color`	string	The color (from CSS)

Returns:

True if transparent

Type: Boolean

<static> last(o)

Convenience function for returning the last property in an object. Note that while this works in all known browsers the EMCA spec does not guarantee that the order of members in an object remain static. This method should therefore be avoiding. When ordering is important use an Array!

Parameters:

Name	Type	Description
`o`	object	A JavaScript object

Returns:

The final member of the object or null if the object is empty

Type: object

<static> linesIntersect(x1, x2, y1, y2, x3, x4, y3, y4, type)

Determines whether two lines intersect

Parameters:

Name	Type	Description
`x1`	number
`x2`	number
`y1`	number
`y2`	number
`x3`	number
`x4`	number
`y3`	number
`y4`	number
`type`	string	Either "segment", "ray" or "line"

Returns:

Returns true if the two lines intersect

Type: boolean

<static> loadScript(scriptName, cb)

Loads JavaScript dynamically. This method keeps a static memory of scripts that have been loaded to prevent them from being loaded twice. The callback function however is always called, even if the script has already been loaded.

Parameters:

Name	Type	Description
`scriptName`	string	The url of the script to load
`cb`	function	Callback function to call when the script is loaded

<static> loadStylesheet(stylesheet, cb)

Loads a stylesheet.

Parameters:

Name	Type	Description
`stylesheet`	string	Name of stylesheet file.
`cb`	function	Function to call when the stylesheet is fully loaded

Since:

2016-03-11

<static> loadUI(url, cb)

Dynamically load UI elements from an external HTML file. This is accomplished by rendering raw HTML in an iframe and then cloning all of the newly created DOM elements into our main document. The iframe is then removed.

The title of the iframe is checked. External content should not have a title. By convention, 404 or 500 errors have a title and so we use this to determine whether the iframe contains valid content or not.

Parameters:

Name	Type	Description
`url`	string	The external url to fetch new UI content
`cb`	function	A callback function to call when the new UI is available

<static> loadWidget(widget, cb)

Loads a feature function widget. Feature function widgets consist of a css file, a JS file and an HTML file. This can be used to dynamically load content and functionality.

Parameters:

Name	Type	Description
`widget`	string	Name of widget. The js, css and html files should be this name.
`cb`	function	Function to call when the widget is fully loaded

<static> localStorageSetItem(name, value)

Convenience function for storing a name value pair in local storage. This will detect if private browsing is enabled because localStorage is inoperable under private browsing

Parameters:

Name	Type	Description
`name`	string	Name to store
`value`	string	Value to store

<static> log10(y)

Returns the log base 10 of a value

Parameters:

Name	Type	Description
`y`	number	The value

Returns:

log10 value

Type: number

<static> makeCamelCase(name)

Converts from hyphenated to camel case. Used primarily for converting css style names (which are hyphenated) to property values (which are camel case)

Parameters:

Name	Type	Description
`name`	string	Hyphenated style name

Returns:

Camel case style name

Type: string

<static> minMax(series, field)

This method will return an tuple [min,max] that contains the minimum and maximum values in the series where values are series[field]

Parameters:

Name	Type	Description
`series`	Array	The series
`field`	string	The name of the field to look at

Returns:

Tuple containing min and max values in the series

Type: Array

<static> mmddhhmm(strdt)

Converts a string form date into mm-dd hh:mm format

Parameters:

Name	Type	Description
`strdt`	string	Date in string format (such as yyyymmddhhmm, yyyy-mm-dd hh:mm, etc)

Returns:

Date in mm-dd hh:mm format

Type: string

<static> mmddyyyy(d)

Converts a JavaScript Date or string form date to mm/dd/yyyy format

Parameters:

Name	Type	Description
`d`	string	Date in JavaScript Date or string format such as YYYY-MM-DD

Since:

2016-07-16

Returns:

Date in mm/dd/yyyy format

Type: string

<static> money(val [, decimals] [, currency])

Prints out a number in US Dollar monetary representation

Parameters:

Name	Type	Argument	Default	Description
`val`	number			The amount
`decimals`	number	<optional>	2	Optional number of decimal places.
`currency`	string	<optional>		Optional currency designation. If omitted, will use $.

Returns:

US Dollar monetary representation // Returns $100.00 STX.money(100, 2);

Type: string

<static> monthAsDisplay(i, displayLetters [, stx])

Convenience function for creating a displayable month name using STX.monthLetters and STX.monthAbv. Please note that those arrays may not be utilized if the library is used in conjuction with Internationalization. This method is used primarily to create the x-axis of a chart

Parameters:

Name	Type	Argument	Description
`i`	number		The numerical month (0-11)
`displayLetters`	boolean		True if just the first letter should be displayed (such as a tight display)
`stx`	object	<optional>	The chart object, only necessary if Internationalization is in use

Returns:

String representation of the month

Type: string

<static> newChild(div, tagName [, className] [, txt])

Convenience function for dynamically creating a new node and appending it into the DOM.

Parameters:

Name	Type	Argument	Description
`div`	object		The targeted parent node
`tagName`	string		The type of node to be created
`className`	string	<optional>	Optional class name to set the new node
`txt`	string	<optional>	Optional text to insert

Returns:

The new node

Type: object

<static> noop()

No operation will be performed. As a result there will be no label drawn around the value. see STX.roundRect

<static> objLength(o)

Returns the number of members in an object

Parameters:

Name	Type	Description
`o`	object	A valid JavaScript object

Returns:

The number of members in the object

Type: number

<static> openDebugger()

Use openDebugger when you don't have access to a console window such as on a touch device. This will pop up a new window for output. @see STX.debug

<static> pageHeight()

Returns the height of the page. It is aware of iframes and so will never return a value that is greater than the value of the parent

Returns:

Height of page in pixels

Type: number

<static> pageWidth()

Returns the width of the page. It is aware of iframes and so will never return a value that is greater than the value of the parent

Returns:

Width of page in pixels

Type: number

<static> postAjax(params)

Convenience function for making an ajax post. If payload is non-null then the method will be set to POST, otherwise GET. Cross origin ajax is support on IE9.

Parameters:

Name Type Description

params

object

Parameters for the post

Properties

Name	Type	Argument	Description
`url`	string		The url to send the ajax query to
`payload`	string	<optional>	An optional payload to send
`cb`	STX.postAjax~requestCallback		Callback function when complete
`contentType`	string	<optional>	Optionally override the content type
`noEpoch`	boolean	<optional>	By default the epoch is appended as a query string to bust caching. Set this to false to not append the epoch.
`headers`	array	<optional>	Optional additional HTTP headers to send

<static> qs( [query])

A parsed query string object Does not support using multi-value keys (i.e. "a=1&a=2")

Parameters:

Name	Type	Argument	Description
`query`	string	<optional>	Query string. If not provided then the browser location's query string will be used

Returns:

An object containing the parsed values of the query string

Type: object

<static> readablePeriodicity(stx)

Creates a string with a periodicity that is easy to read given a chart

Parameters:

Name	Type	Description
`stx`	object	A chart object

Returns:

A periodicity value that can be displayed to an end user

Type: string

<static> rect()

Draws a rectangle on the canvas see STX.roundRect

<static> replaceFields(obj, mapping)

This method will iterate through the object and replace all of the fields using the mapping object. This would generally be used to compress an object for serialization. so that for instance "lineWidth" becomes "lw". This method is called recursively.

Parameters:

Name	Type	Description
`obj`	object	Object to compress
`mapping`	object	Object containing name value pairs. Each name will be replaced with its corresponding value in the object.

Returns:

The newly compressed object

Type: object

<static> reverseObject()

This method reverses the fields and values in an object

<static> roundRect(ctx, x, y, width, height, radius [, fill] [, stroke])

Draws a rounded rectangle on the canvas.

Parameters:

Name	Type	Argument	Description
`ctx`	object		A valid HTML Canvas Context
`x`	number		Left position of drawing on canvas
`y`	number		Top position of drawing on canvas
`width`	number		Width of rectangle
`height`	number		Height of rectangle
`radius`	number		Radius of rounding
`fill`	Boolean	<optional>	Whether to fill the background
`stroke`	Boolean	<optional>	Whether to fill the outline

<static> roundRectArrow(ctx, x, y, width, height, radius [, fill] [, stroke])

Draws a rounded rectangle with an arrowhead on the screen.

Parameters:

Name	Type	Argument	Description
`ctx`	object		A valid HTML Canvas Context
`x`	number		Left position of drawing on canvas
`y`	number		Top position of drawing on canvas
`width`	number		Width of rectangle
`height`	number		Height of rectangle
`radius`	number		Radius of rounding
`fill`	Boolean	<optional>	Whether to fill the background
`stroke`	Boolean	<optional>	Whether to fill the outline

<static> safeClickTouch(div, fc, params)

Use this instead of onclick or ontouch events. This function will automatically use the quickest available but also protect against being called twice. By default any previous safeClickTouch listeners will be cleared (to allow re-use of the element).

Parameters:

Name Type Description

div

object

The DOM element to attach an event

fc

function

The function to call when the object is pressed

params

object

Parameters to drive behavior.

Properties

Name	Type	Argument	Default	Description
`safety`	object	<optional>		An optional object, generated from a STX.safeDrag association to prevent the click from being triggered when a drag operation is released
`allowMultiple`	boolean	<optional>	false	If set then multiple click events can be associated with the node
`preventUnderlayClick`	boolean	<optional>	true	By default prevents an underlaying element from being "clicked" on a touch device 400ms after the overlay was tapped. Set to false for input fields, or any div containing input fields (body)
`absorbDownEvent`	boolean	<optional>	true	Ensures that a mousedown, pointerdown, touchstart event doesn't get passed to the parent.

Since:

11/01/2015 Removed timers in favor of a new algorithm. This algorithm allows only the first event to fire from a UI interaction to execute the fc function.

<static> safeDrag(div [, fcDown] [, fcMove] [, fcUp])

Safe function to handle dragging of objects on the screen. This method is cross-device aware and can handle mouse or touch drags. This method does not actually move the objects but provides callbacks that explain when drag operations begin and cease, and what movements are made during the drag. Callbacks should be used to move the actual objects (if it is desired to move objects during a drag operation). For convenience, displacementX and displacementY are added to callback events to indicate the distance from the original starting point of the drag. A "safety" object is returned which can optionally be passed into STX.safeClickTouch to prevent errant click events from being triggered when a user lets go of a drag

Parameters:

Name	Type	Argument	Description
`div`	object		The draggable DOM element
`fcDown`	function	<optional>	Callback function when a drag operation begins. Receives an event object.
`fcMove`	function	<optional>	Callback function when a drag move occurs. Receives an event object.
`fcUp`	function	<optional>	Callback function when the drag operation ends. Receives an event object.

Returns:

Safety object which can be passed to STX.safeClickTouch

Type: object

<static> safeMouseOut(node, fc)

Used in conjuction, safeMouseOut and safeMouseOver ensure just a single event when the mouse moves in or out of an element. This is important because simple mouseout events will fire when the mouse crosses boundaries within an element. Note that this function will do nothing on a touch device where mouseout is not a valid operation.

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`fc`	function	Function to call when the mouse has moved out

<static> safeMouseOver(node, fc)

This method is guaranteed to only be called once when a user mouses over an object. @see STX#safeMouseOut

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`fc`	function	Function to call when mouse moves over the object

<static> scrub(obj [, removeNulls])

Deletes (removes) nulls or undefined fields (names) from an object. This is useful when marshalling (saving) an object where you don't wish null or undefined values to show up in the marshalled object (such as when converting to JSON)

Parameters:

Name	Type	Argument	Description
`obj`	object		The object to scrub
`removeNulls`	boolean	<optional>	Whether or not to remove null values

<static> SearchableWordList(list, maxResults, contains)

Creates an object which allows searching of a word list

Parameters:

Name	Type	Description
`list`	Array	Array of objects. Object takes the form: {id:"id", name:"name", keywords:"space delimited list of keywords", category:"filterable category"}
`maxResults`	integer	Maximum results to return, defaults to 50
`contains`	boolean	If true, will search within a word for a match

Since:

2015-11-1

<static> semiRoundRect()

Draws a rectangle on the canvas with just the right side curved corners see STX.roundRect

<static> setCaretPosition(ctrl, pos)

Sets the position of the cursor within a textarea box. This is used for instance to position the cursor at the end of the text that is in a textarea.

Parameters:

Name	Type	Description
`ctrl`	object	A valid textarea DOM element
`pos`	number	The position in the text area to position

<static> shallowClone(from)

Non recursive clone. This will only clone the top layer and is safe to use when objects contain DOM nodes.

Parameters:

Name	Type	Description
`from`	object	Object to be cloned

Returns:

A shallow clone of the "from" object

Type: object

<static> standardUTCDate(dt)

Converts a date into YYYY-MM-DDTHH:MM:SSZ format (UTC)

Parameters:

Name	Type	Description
`dt`	date	A JavaScript Date object

Returns:

Date in YYYY-MM-DDTHH:MM:SSZ format

Type: string

<static> stripPX(text)

Strips the letters "px" from a string. This is useful for converting styles into absolutes.

Parameters:

Name	Type	Description
`text`	string	String value with "px"

Returns:

The numeric value

Type: number

Example

var leftPosition=STX.stripPX(node2.style.left)

<static> strToDate(dt)

Converts a string form date into a JavaScript object. Only use if you know that the string will not include a time, otherwise use @see STX.strToDateTime

Parameters:

Name	Type	Description
`dt`	string	Date in string format such as MM/DD/YY or YYYYMMDD or 2014-10-25T00:00:00+00:00 or 201506170635

Returns:

JavaScript date object -new Date()-

Type: Date

<static> strToDateTime(dt)

Converts a string form date into a JavaScript Date object with time. Supports various standard date formats

Parameters:

Name	Type	Description
`dt`	string	String form of a date (such as yyyymmddhhmm, yyyy-mm-dd hh:mm, etc)

Returns:

A JavaScript Date object

Type: date

<static> swapClassName(node, newClassName, oldClassName)

Convenience method for swapping two class names within a node. Such as for changing state.

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`newClassName`	string	The class name to swap in
`oldClassName`	string	The class name to swap out

<static> textLabel(x, y, text, stx, style)

Creates a box on the canvas with containing text (a label)

Parameters:

Name	Type	Description
`x`	number	Left position of label
`y`	number	Top position of label
`text`	string	Text to print in the label
`stx`	object	Chart object
`style`	string	Class name from which style should be applied

<static> tickedRect(ctx, x, y, width, height, radius [, fill] [, stroke])

Draws a ticked rectangle on the canvas. For use in the y-axis label.

Parameters:

Name	Type	Argument	Description
`ctx`	object		A valid HTML Canvas Context
`x`	number		Left position of drawing on canvas
`y`	number		Top position of drawing on canvas
`width`	number		Width of rectangle
`height`	number		Height of rectangle
`radius`	number		Radius of rounding
`fill`	Boolean	<optional>	Whether to fill the background
`stroke`	Boolean	<optional>	Whether to fill the outline

<static> timeAsDisplay(dt [, stx] [, precision])

Displays a time in readable form. If Internationalization is in use then the time will be in 24 hour Intl numeric format

Parameters:

Name	Type	Argument	Description
`dt`	date		JavaScript Date object
`stx`	object	<optional>	Optional chart object if Internationalization is in use
`precision`	number	<optional>	Optional precision to use. If `null` then `hh:mm`. `STX.SECOND` then `hh:mm:ss`. If `STX.MILLISECOND` then `hh:mm:ss.mmmmm`

Returns:

Human friendly time, usually hh:mm

Type: string

<static> translatableTextNode(stx, english [, language])

Creates a document node which facilitates translation to other languages, if stx.translationCallback callback function is set. If there is no translationCallback, a standard text node is returned.

Parameters:

Name	Type	Argument	Description
`stx`	STXChart		The chart object
`english`	string		The word to translate
`language`	string	<optional>	Optional language. Defaults to STX.I18N.language.

Returns:

A node in the following form if translationCallback exists: translation If it does not exist, a text node is returned.

Type: Node

<static> unappendClassName(node, className)

Removes a class name from a node if it is set

Parameters:

Name	Type	Description
`node`	object	A valid DOM element
`className`	string	The class name to remove

<static> uniqueID()

Returns a short, pseudo unique ID based on the current time. Radix 36 is used resulting in a compact string consisting only of letters and numerals. While not guaranteed to be unique, this function has a high probability of uniqueness when it is triggered by human activity even in a large user base.

Returns:

A unique string consisting of letters and numerals

Type: string

<static> withinElement(node, x, y)

Returns true if a point, in absolute screen position, is within an element

Parameters:

Name	Type	Description
`node`	object	A valid DOM element to check whether the point overlaps
`x`	number	Absolute screen X position of point
`y`	number	Absolute screen Y position of pointer

Returns:

True if the point lies inside of the DOM element

Type: boolean

<static> xIntersection(vector, y)

Determines the X value at which point Y intersects a line (vector)

Parameters:

Name	Type	Description
`vector`	object	Object of type {x0,x1,y0,y1}
`y`	number	Y value

Returns:

X intersection point

Type: number

<static> yIntersection(vector, x)

Determines the Y value at which point X intersects a line (vector)

Parameters:

Name	Type	Description
`vector`	object	Object of type {x0,x1,y0,y1}
`x`	number	X value

Returns:

Y intersection point

Type: number

<static> yyyymmdd(dt)

Converts a JavaScript Date to yyyy-mm-dd format

Parameters:

Name	Type	Description
`dt`	date	JavaScript Date object

Returns:

Date in yyyy-mm-dd format

Type: string

<static> yyyymmddhhmm(dt)

Converts a date into yyyymmddhhmm format

Parameters:

Name	Type	Description
`dt`	date	A JavaScript Date object

Returns:

Date in yyyymmddhhmm format

Type: string

<static> yyyymmddhhmmssmmm(dt)

Converts a date into yyyymmddhhmmssmmm format

Parameters:

Name	Type	Description
`dt`	date	A JavaScript Date object

Returns:

Date in yyyymmddhhmmssmmm format

Type: string

Namespace: STX

Classes

Namespaces

Members

<static> colorPickerColors

Example

<static> FibDialog

<static> iscroll

<static> privateBrowsingAlert

<static> ScrollManager

Methods

<static> addMemberToMasterdata(stx [, label], data [, fields] [, createObject] [, fieldForLabel])

Parameters:

Example

<static> alert(text)

Parameters:

Example

<static> appendClassName(node, className)

Parameters:

Example

<static> attachColorPicker(colorClick, cpHolder, cb)

Parameters:

<static> boxIntersects(bx1, by1, bx2, by2, x0, y0, x1, y1, vtype)

Parameters:

Returns:

<static> calculateHeikinAshi(stx, dataSet)

Parameters:

Returns:

<static> calculateKagi(stx, dataSet, reversal)

Parameters:

Returns:

<static> calculateLineBreak(stx, dataSet, pricelines)

Parameters:

Returns:

<static> calculatePointFigure(stx, dataSet, pandf)

Parameters:

Properties

Returns:

<static> calculateRangeBars(stx, dataSet, range)

Parameters:

Returns:

<static> calculateRenkoBars(stx, dataSet, range)

Parameters:

Returns:

<static> calculateTradingDecimalPlaces(params)

Parameters:

Properties

Returns:

<static> chooseForegroundColor(backgroundColor)

Parameters:

Returns:

<static> clearCanvas(canvas [, stx])

Parameters:

<static> clearNode(node)

Parameters:

<static> clearSafeClickTouches(div)

Parameters:

<static> clone(from [, to])

Parameters:

Returns:

<static> colorToHex(color)

Parameters:

Returns:

Example

<static> commas(val)

Parameters:

Returns:

Example

<static> computeEquationChart(equation, map)

Parameters:

Returns:

<static> condenseInt(txt)

Parameters:

Returns:

Example

<static> convertClickToTouchEnd(id)

Parameters:

<static> convertCurrencyCode(code)

Parameters:

Returns: