ChartIQ SDK Legacy Documentation -

Class: Tooltip

STX. Tooltip

new Tooltip(tooltipParams)

Use this constructor to create a floating "tooltip" on the crosshairs, showing values of series, studies, etc at the point in time where pointer is located.

Note 1: this only works when crosshairs are on.
Note 2: this requires jquery.

Color and layout can be managed via stx-hu-tooltip CSS style and related sub classes in stx-chart.css

Tooltip automatically creates itself and exists in HTML in the following form:

<stx-hu-tooltip>
        <stx-hu-tooltip-field>
            <stx-hu-tooltip-field-name></stx-hu-tooltip-field-name><stx-hu-tooltip-field-value></stx-hu-tooltip-field-value>
        </stx-hu-tooltip-field>
        ...
        <stx-hu-tooltip-field>
            <stx-hu-tooltip-field-name></stx-hu-tooltip-field-name><stx-hu-tooltip-field-value></stx-hu-tooltip-field-value>
        </stx-hu-tooltip-field>
</stx-hu-tooltip>

The stx-hu-tooltip-field blocks are inserted automatically in this order: DT, Open, High, Low, Close, Volume, series, studies You can alter this default order or create a custom label by manually creating a stx-hu-tooltip HTML element and inserting an stx-hu-tooltip-field block in it for each field on the order you choose:

  • Just add an attribute to the stx-hu-tooltip-field element of field="[fieldname]".
  • You can also populate the stx-hu-tooltip-field-name element with an alternate label.
Parameters:
Name Type Description
tooltipParams object

The constructor parameters

Properties
Name Type Argument Description
stx STXChart <optional>

The chart object
ohl boolean <optional>

set to true to show OHL data (Close is always shown).
volume boolean <optional>

set to true to show Volume
series boolean <optional>

set to true to show value of series
studies boolean <optional>

set to true to show value of studies
Since:
  • 2016-09-19
Examples
// HTML to override default order and labels of fields.
// This will force the `DT` field to be labeled `Date/Time` and be placed on the top, 
// followed by the `Close` field and the n the renaming fields as determined by the parameters
	<stx-hu-tooltip>
				<stx-hu-tooltip-field field="DT">
					<stx-hu-tooltip-field-name>Date/Time:</stx-hu-tooltip-field-name>
					<stx-hu-tooltip-field-value></stx-hu-tooltip-field-value>
				</stx-hu-tooltip-field>
				<stx-hu-tooltip-field field="Close">
					<stx-hu-tooltip-field-name></stx-hu-tooltip-field-name>
					<stx-hu-tooltip-field-value></stx-hu-tooltip-field-value>
				</stx-hu-tooltip-field>
			</stx-hu-tooltip>
// define a hover tool tip.
new STX.Tooltip({stx:stxx, ohl:true, volume:true, series:true, studies:true});