ChartGL

Enter a name for the component.

Enter a View State Parameter which stores the x-axis value contingent on where the hover bar is on the chart. For example time or date.

Enter a View State Parameter to store the x-axis value at the selected position. For example time or date.

Use this option to allow for the first time in the first layer to be selected when the chart loads.

• When checked, and when the Selected property is set to a viewstate, it sets the Selected viewstate value to be the first point in the first layer on initial chart load.

• This is unchecked by default.

When this is enabled the user can click and drag on a chart as normal, but instead of zooming, it stores the x-axis range values. The values can be accessed by assigning view states to the Selection Min & Selection Max properties on the x-axes. It turns the chart into a selector that stores the values in the x-axis Selection Min and Selection Max view state properties.

When this is checked, it overrides the Zoom checkbox. If both are left unchecked, the chart does not zoom or use the range selection.

Check to enable/disable zoom. This feature makes it possible to zoom on a region within both x and y axis, or individually on each x or y axis. Double-Clicking the chart resets the chart to its initial state.

Mouse scroll can be used for x-axis zoom, with mouse scroll + shift key for y-axis zoom.

Define the zoom animation and length of time in milliseconds to complete.

This drop-down list of options are used to control how the zoom animation transitions. For example bounce creates a spring like effect. There are a number of options for you to try.

The Pan feature lets you pan along one axis at a time. To pan, click and drag from anywhere on the axis. Double-clicking the chart resets the chart to its initial state.

Enable this to set the Load Time (ms) value.

Use this to set a View State Parameter used to track the load time of the chart, in milliseconds, on each update of the data. This is useful for tracking the performance of the chart to see how long it takes to load. When Track Load Time is checked, and Load Time (ms) has a view state set, it writes the time in ms into the view state. This view state value can then be displayed in a text component, as shown in the Chart Load Time on the following chart.

Specify the Data sources to be used for the layer. This is not relevant to Baseline layers as they use Baseline Value/Baseline Axis to specify where the Baseline is drawn.

Enter a name for the chart legend label.

Select the x-axis from the defined Axes.

Select the y-axis from the defined Axes.

Select data columns to plot X-Axis data from the data source.

Select data columns to plot Y Axis data from the data source.

Y Axis includes a wildcard selection (*) for multiple columns. Wildcard selection uses columns of the most common, single kdb type. For example, if a data set has one date type column, three integer type columns, and five float type columns, only the five float columns are plotted using the wildcard. The integer and date columns are ignored.

Regular expressions can also be used to define the y-axis.

When a wildcard or regular expression is used, the Color Palette defines point color for each added column.The following kdb data types are supported; byte, char, date, datetime, float, int, long, minute, month, real, second, short, string, symbol, time, timespan, and timestamp.

Add multiple x-axis groups by selecting one or more columns to populate the multiple x-axes, without affecting the datapoints shown. Each column is a separate x-axis, grouping values together. You can format the axis settings on the layer's linked x-axis under Multi Axis Format.

An example of multi x-axis groups is shown in the below image. This displays two charts, the top one showing 2 levels of multi axis grouping, and the bottom showing 3 levels. For the bottom chart, the x-axis is populated with the column grp1 and the multi axis grouping is populated with the columns grp2 and grp3, which each display an x-axis. Each unique value in the column is seen as a group, so it displays one label for each unique value. For example, in the bottom chart, the grp3 axis is split into two groups: Jan and Oct.

The below query is used in the above example:

These properties only relate to Candlestick layers. Select the data columns that correspond to the open, high, low, and close price points.

This is only relevant for Heatmap layers. Select the data column that corresponds to the X1 coordinate.

This is only relevant for Heatmap layers. Select the data column that corresponds to the X2 coordinate.

This is only relevant for Heatmap layers. Select the data column that corresponds to the Y1 coordinate.

This is only relevant for Heatmap layers. Select the data column that corresponds to the Y2 coordinate.

This is only relevant for Heatmap layers. Select the data columns that correspond to each. Colors are defined by the Score column, which uses the Color Palette.

Select color for single plot (non-wildcard/regex) data sets.

Define the opacity of the points from a value between 0 (transparent) and 100 (opaque).

This is only relevant for Bar layers and defines the bar width as a percentage of its range when Bar Percentage is selected from Bar Width Type.

This is only relevant for Bar layers. It defines the bar width as a fixed value when Fixed Width is selected from Bar Width Type.

This is only relevant for Bar layers. Use the dropdown to select either Bar Percentage and Fixed Width.

This is only relevant for Bar layers. Use the dropdown to select either Vertical and Horizontal.

This is only relevant for Bar layers and is used when the layer type is Waterfall to define the visual style of the Waterfall bar increase colors based on the previous bar value.

This is only relevant for Bar layers and is used when the layer type is Waterfall to define the visual style of the Waterfall bar decrease colors based on the previous bar value.

This is used, when the layer type is Bounds, to define the x1 coordinates of the bounding region.

This is used, when the layer type is Bounds, to define the x2 coordinates of the bounding region.

This is used when, the layer type is Baseline, to define the axis at which to draw the baseline, based on the Baseline Value.

This is used, when the layer type is Baseline, to define the value at which to draw the baseline. The axis on which this is draw in set in Baseline Axis. This is used in place of a Data Source.

Use this dropdown to assign the layer legend to a Legend Group

Select a data column to apply color. When a column is selected, the Color Palette defines point color for each unique value in the column. This is not applicable to Baseline layers.

Enable this to display the last tick in the series on the y-axis.

Enable this when using streaming data to improve performance by caching data.

Use this to toggle the display of the data legend.

This dropdown gives options to set the variable point size for the bubbles. Select either Fixed Size or one of the columns from the associated data source.

Define the bubble size.

Increase the bubble size on zoom.

Use the icon selector to choose an icon to be displayed in the position of the data points on the chart.

Icons also support a base64 image in a view state parameter.

Set the color of bubbles when using a Line layer

Set the color for down day candles.

Set the color for up day candles.

Set the color for flat days.

Define the candlestick body width as a percentage of its range when Bar Percentage is selected under Bar Width Type.

Define the candlestick body width as a fixed value when Fixed Width is selected under Bar Width Type.

Use the dropdown to select either Bar Percentage and Fixed Width.

Set the thickness of the line.

Choose between None, Dashed, Dotted.

When Line Style is Dotted or Dashed, set the size of the gaps.

When Line Style is Dashed, set the width of the dashes.

Select a fill option: No Fill - No color fill Layer n - For color fill between the charted line and the selected layer. This option is only shown if there is more than one layer. Origin - For color fill between the chart line and X-axis

The color to be used for line fill for single plot (non-wildcard/regex) data sets.

The opacity used for line fill.

Where a line fill color is employed, a transparency gradient is applied to the layer.

Where there is missing data, check this to connect isolated points.

Choose between the following types of interpolation:

Linear - connects data points with straight lines.

Stepped - assumes that the function remains constant between adjacent data points. It creates a step-like curve where the value jumps from one data point to the next without any intermediate values.

Monotone - the interpolated curve maintains monotonicity (either strictly increasing or strictly decreasing) between data points. Monotone Interpolation comes with a performance caveat, so isn't suitable for streaming.

Use this to switch between stepped line chart types; Before and After.

Turn on or off data labels. This can be tied to a view state.

Set the color of the Label text.

Labels are applied to every nth data point where n is value set here.

Choose the position label; top, bottom, left, right, or center of the data point.

The offset represents the distance (in pixels) to pull the label away from the data point. This can be specified as a single number (for example 4) or an x,y coordinate (for example 4,10).

Set the clockwise rotation angle (in degrees) of the label with the rotation center point being the label center. The default value is 0 (no rotation)

The max number of labels to draw. The default value is 10.

Define the data to display. This must return a string; HTML is not supported. Select the data to display with the Template Editor in either Basic or Advanced mode. Existing data and view states can be displayed. Handlebar helpers can be used for formats.

Choose between, Line, Linear, Category, Time or Logarithmic data.

Select whether you want to position the axis to the top or bottom of the chart.

Set the height of the tick area of the x-axis in pixels.

When the X-Axis Type is set to Time, you can specify the type of tick spacing as either: Number of Ticks or Fixed Tick Interval (ms)

The next field displayed depends on the option selected.

Set the number of ticks to display in the axis. The default is 10.

Set the interval between ticks in milliseconds. For example an interval of 1800000 results in 30 min tick intervals on the x-axis.

Select the color of the axis.

Displayed when the Axis Type is set to Category. When using non-linear data (string/symbol), some values may be the same. Filter unique is used for grouping same values together. For example, a data source might have 'b' and 'b' in it twice. If filter unique is enabled it groups points for 'b' as having the same x-axis value. If disabled it shows values at different points.

In the following example the ChartGL named Layer1 has Filter Unique ticked and so only shows unique values. The second chart hasn't been set to Filter Unique and so the same value is displayed more than once.

Displayed when the Axis Type is set to Category. When checked, the axis data is sorted. Strings are sorted alphabetically. This is unchecked by default.

Enable the use of Min and Max to build the x-axis. If these are unchecked the Min and Max values, set below, are ignored.

Define the minimum value for the x-axis.

Define the maximum values for the x-axis. Charted data outside of the set Min and Max range is not displayed. If all data falls outside the set range, the chart is blank.

Pull min x-axis values on a zoom select into the assigned view state parameters.

Enable to align x-axis grid lines to the mid-point between tick values.

Define the color of x-axis grid lines.

Toggles the display of x-axis.

Set the clockwise rotation angle (in degrees) of the label. The default value is 0 (no rotation)

When enabled, the axis data starts at zero.

Hides the display of trailing zeroes in x-axis tick values.

Sets the x-axis format as either Number,Smart Number, Formatted Number. For example 1000, 1K, 1,000.

Select the x-axis date/time format from the options in the drop-down list, including; YYYY-MM-DD, YYYY-MMM-DD,YYYY-MM, YYYY-MM-DD HH:mm:ss and more.

Sets the precision point for x-axis numeric labels.

Sets the tick font size in pixels.

Adds text to the start of tick label; for example currency or percentage symbol.

Adds text to the end tick label; for example currency or percentage symbol.

Distribution, Break, and Trigger Break fields are all related and are only displayed when the X-Axis Type is set to Time. They are used when a chart, with time related data, has a break in the data, for example over a weekend when no new data comes in. This setting is used to shorten the length of the display of this empty data so there isn't a big gap shown. The options are Linear or Smart. If linear is chosen it remains as is. If Smart is selected the following two properties are used.

When Distribution is set to Smart, use this to define the duration of time in milliseconds at which to break. That is, the space in ms between the two data points you want to shorten: pointB - pointA.

When Distribution is set to Smart, use this to define the new duration, in milliseconds from the start point; newPointB = pointA + Trigger Break (ms).

Used when the X-Axis Type is set to Time. When enabled, major ticks are generated. Each major tick represents a new parent time (based on the child minor ticks). Minor ticks are shown by default.

Enables the display of the x-axis label.

Defines x-axes label text.

Choose between Linear, Category, Time, or Logaritmic data.

Set the position of the axis to the Left or Rightof the chart.

Sets the width of the tick area of the y-axis in pixels.

When the Y-Axis Type is set to Time, you can specify the type of tick spacing as either: Number of Ticks or Fixed Tick Interval (ms).

The next field displayed depends on the option selected.

Set the number of ticks to display in the axis. The default is 10.

Set the interval between ticks in milliseconds. For example an interval of 1800000 results in 30 min tick intervals on the y-axis.

Select the color of the axis.

Displayed when the Axis Type is set to Category. When using non-linear data (string/symbol), some values may be the same. Filter unique is used for grouping same values together. For example a data source might have 'b' and 'b' in it twice. If filter unique is enabled it groups points for 'b' as having the same y-axis value. If disabled it shows values at different points.

In the following example the ChartGL named Layer1 has Filter Unique ticked and so only shows unique values. The second chart hasn't been set to Filter Uniqueand so the same value is displayed more than once.

Displayed when the Axis Type is set to Category. When enabled, sorts the data. If using strings, sort alphabetically.

Enables the use of Min and Max to build y-axis.

Defines the minimum value for the y-axis.

Defines the maximum values for the y-axis. Charted data outside of the set Min and Max range is not displayed. If all data falls outside the set range, the chart is blank.

Pulls min y-axis values on a zoom select into assigned view state parameters.

Enables the alignment of y-axis grid lines to the mid-point between tick values.

Defines the color of y-axis grid lines.

Toggles the display of y-axis.

Set the clockwise rotation angle (in degrees) of the label. The default value is 0 (no rotation)

When enabled, the axis data starts at zero.

Hides the display of trailing zeroes in y-axis tick values.

Sets the y-axis format as either Number, Smart Number, or Formatted Number. For example 1000, 1K, 1,000.

Sets the precision point for y-axis numeric labels.

Sets the tick font size in pixels.

Adds text to the start of tick label; for example currency or percentage symbol.

Adds text to the end tick label; for example currency or percentage symbol.

Distribution, Break, and Trigger Break are all related and are only displayed when the Y-Axis Type is set to Time. They are used when a chart, with time related data, has a break in the data, for example over a weekend when no new data comes in. This setting is used to shorten the length of the display of this empty data so there isn't a big gap shown.

The options are:

Linear- If linear is chosen it remains as is.

Smart - If Smart is selected the following two properties are used.

This defines the duration of time in milliseconds at which to break at. That is, the space in ms between the two data points you want to shorten: pointB - pointA.

This defines the new duration, in milliseconds from the start point; newPointB = pointA + Trigger Break (ms).

Check to enable the display of y-axis label.

Defines the y-axis label text.

When this is checked crosshairs are shown on the chart.

When this is checked coordinates are shown on chart.

When this is checked crosshairs and coordinates move to the nearest valid point on hover.

When this is checked the Custom tooltip is enabled.

Defines a custom tooltip. See Custom tooltips for details.

When checked, shows all layers in the tooltip. Otherwise, only shows the hovered layer.

Displays all y-axis values for selected point on the x-axis.

Defines a name for the Legend Group. This value is added to the list displayed under Legend Group in the general layer properties.

Expands/collapses the Legend Group.

Check this to display the Annotate controls on the component . These controls consist of:

Turn the ability to create annotations on/off

Edit annotations

Undo annotations

Redo annotations

Sets the type of annotation.

Sets the color of the annotation to be created. Click on the field to bring up the color picker. The Edit section contains a table of existing annotations each with a color button to change its color and a delete button to delete the specified annotation. The text note has an additional Edit button which brings up the text note dialog to update the text and styling of the text note. Changes made here appear on the chart in real-time.

Deletes all annotations.

Commits all changes in the dialog.

This is the default type. A text note is text that can be added directly to the chart. Upon creation of the text note, the text note dialog is launched so users can edit the text and styling of the text note. To edit, double-click on the text note to bring up the text note dialog. The text note resizes automatically based on the text and styling. The font size of the text note does not scale when the chart is zoomed in or out. To move the text note, hover over it until the mouse pointer changes to the multidirectional cursor, then click and drag it to the new position.

A rectangle is a 4-sided polygon having all right angles. To move the rectangle, hover over the rectangle until the mouse pointer changes to the multidirectional cursor, then click and drag the rectangle to the new position. To resize the rectangle, hover over any endpoint until the color of the square anchor changes to red and then click and drag the endpoint to its new position.

A horizontal line is a line that extends the width of the chart. Horizontal lines can only be moved up or down. To move the horizontal line, hover over the line until the mouse pointer changes to a bidirectional cursor, then click and drag the line to its new position.

A vertical line is a line extends the height of the chart. Vertical lines can only be moved left or right. To move the vertical line, hover over the line until the mouse pointer changes to a bidirectional cursor, then click and drag the line to its new position.

The text to be displayed in the note.

A color picker used to set the color for the text.

The font size of the text.

When checked, the text is bold.

Sets the space between the text note border and the text.

Sets the fill color of the text note area. Click on the field to bring up the color picker.

Sets the fill opacity of the text note area. Slide to the left for more transparency and to the right for more opacity.

Sets the thickness of the text note border.

Sets the border color of the text note. Click on the field to bring up the color picker.

Sets the border opacity of the text note. Slide to the left for more transparency and to the right for more opacity.