Class: XAxis

XAxis

XAxis is an object that represents a range of the time being plotted. There can be only one instance of an XAxis on a chart. The XAxis is interactable. It can be zoomed in and out. The XAxis can be configured to use different algorithms for rendering the dates on the ticks. A robust algorithm comes with compact chart and is found in modules/axes.js. A custom algorithm can be written but instructions for that are beyond this documentation at the present time.

Since:

  • 9.4.0

Type Definitions

XAxisConfig

All configurations, including themeing, relating to the XAxis object go here. Note: The XAxisInit object this inherits from has all optional properties.

Type:
Properties:
Name Type Argument Description
drawFn XAxisDrawFunction <optional>

Axis drawing function from Axes import (Axes.drawXAxis), or custom function.
intervalFormatting Record.<string, XAxisIntervalFormatter> <optional>

Axis formatting object from Axes import (Axes.setPropertiesForInterval), or custom object.
representationFn XAxisRepresentationFunction <optional>
<nullable>

Axis representation function from Axes import (Axes.axisRepresentation), or custom function.
fontSize string <optional>

Axis font size.
fontFamily string <optional>

Axis font family.
fontStyle string <optional>

Axis font style (e.g. italic).
fontWeight string <optional>

Axis font weight (e.g. bold).
backgroundColor string <optional>

Axis background color.
color string <optional>

Axis text color.
gridLine LineTheme <optional>

Axis grid line treatment.
gridDivider LineTheme <optional>

Axis grid divider treatment.
gridBoundary LineTheme <optional>

Axis grid boundary line treatment.
Since:

  • 9.4.0

Example

Setting up the x axis default functions:

import * as Axes from "../js/modules/axes.js";
const config = {
	...
	xaxis: {
		drawFn: Axes.drawXAxis,
		intervalFormatting: Axes.setPropertiesForInterval,
		representationFn: Axes.xaxisRepresentation,
		...
	}
};

XAxisDataRecord

Record containing data to be displayed on an axis tick.

Type:
  • object
Properties:
Name Type Argument Description
dt Date <optional>

Date of record.
data DataRecord <optional>
<nullable>

Data, if available.
Since:

  • 9.4.0

XAxisDrawFunction( [axisRepresentation])

Draw function for x axis. Function's this is a CompactChart instance. This function should utilize an algorithm to determine which of the ticks passed in as input should actually be rendered. There are often many more possible ticks than can be drawn legibly on the chart.

Parameters:
Name Type Argument Description
axisRepresentation Array.<XAxisRepresentationRecord> <optional>

Array of possible ticks.
Since:

  • 9.4.0

XAxisFormatter(dt)

Formatting function for x axis labels.

Parameters:
Name Type Description
dt Date

Date to format.
Since:

  • 9.4.0

Returns:

Formatted date as a string.

Type
string

XAxisInit

Properties relating to the x axis that are set by default to certain values. The XAxis object controls anything going on the canvas.

Type:
  • object
Properties:
Name Type Argument Default Description
adjustTimeZone boolean <optional>

Set to false to disallow timezone support on the axis.
asFooter boolean <optional>

Set to false to draw axis under the main chart panel as opposed to under the bottom-most panel.
displayGridLines boolean <optional>

Set to false to not draw vertical gridlines.
formatter XAxisFormatter <optional>
<nullable>

Optional function to format a date display on the axis.
futureTicks boolean <optional>

Set to false to stop displaying axis labels in the future.
futureTicksInterval number <optional>
 1

When displaying tick periodicity, this value is the "period", or number of ticks to consolidate.
height number <optional>

Pixel height of axis.
lineBaseLevel number <optional>
 500

Minimum state level of a non-boundary label on the axis.
minimumLabelWidth number <optional>
 50

Smallest number of pixels an axis label can take up.
noDraw boolean <optional>

Set to true to hide the axis (but its footprint is preserved).
Since:
  • 9.4.0 Introduced
  • 10.1.0 Set noDraw type to boolean.

XAxisIntervalFormatter(repRecord, record, market, qc)

Formatting function for x axis labels based on the interval being displayed. Function does not actually return anything; it populates a text field in the XAxisRepresentationRecord with the formatted string.

Parameters:
Name Type Description
repRecord XAxisRepresentationRecord

Object with properties used for rendering tick on axis.
record XAxisDataRecord

Data for the tick being formatted.
market Market | undefined

Market of main symbol on chart.
qc CompactChart

CompactChart instance.
Since:

  • 9.4.0

XAxisRepresentationFunction()

Function that returns x axis representation. This is an array of objects representing possible ticks on the x axis. Function's this is a Chart instance.

Since:

  • 9.4.0

Returns:

Array of possible ticks.

Type
Array.<XAxisRepresentationRecord>

XAxisRepresentationRecord

Abstract class for a user-defined object containing fields to be used to help draw an axis tick. The fields in this object are not important to the CompactChart core but the contract is meant to be understood by the drawFn, representationFn, and intervalFormatting functions specified in the configuration.

Type:
  • object
Properties:
Name Type Argument Description
text string <optional>

Text to display
Since:

  • 9.4.0