JavaScript Chart with DateTime Axis - Editor

date-time axis xy

This example shows creation of a DateTime Axis, for rendering XY-series where either/both of X/Y dimensions can present time. This doesn't affect the input of data - format remains as {x: number, y: number} - however, DateTime-axes format their values from number to a date and time. This affects axis labels, markers and cursors.

A DateTime-Axis is created by specifying its TickStrategy. Here's how it looks when setting the Axis TickStrategy:

// Add an XY Chart
const chart = lightningChart().ChartXY({})
// Set the TickStrategy of the default X Axis to a DateTime TickStrategy
chart.getDefaultAxisX().setTickStrategy(AxisTickStrategies.DateTime)

The above mentioned examples will provide an Axis that will format its scale values to their DateTime-representations.