DateTime Axis Origin

This example shows the usage of Origin Date with DateTime Axis TickStrategy, for rendering XY-series where either or both of X/Y dimensions can present time.

In the example, both charts use the same data, with each point of data set to be an hour apart along the X Axis; What is different between the charts, is the origin for the DateTime TickStrategy used in the X Axis.

The top chart uses the default origin (January 1st, 1970), while the bottom chart uses a custom origin (set to current Date).

The origin-date can be specified to whichever DateTime is desired. It is done by passing a javascript Date object to the function that creates the DateTime TickStrategy:

// Define the origin-date. (y, m [0-11], d [1-31], h [0-23])
const originDate = new Date(2002, 0, 1, 13)
// Create DateTime AxisTickStrategy with specified originDate.
const dateTimeTickStrategy = AxisTickStrategies.DateTime(originDate)
// Create a chart
const chart = lightningChart().ChartXY({})
// Get the default X Axis
chart
    .getDefaultAxisX()
    // Set the Tick Strategy to use
    .setTickStrategy(
        AxisTickStrategies.DateTime,
        // Use created DateTime AxisTickStrategy in the X Axis
        (tickStrategy) => tickStrategy.setDateOrigin(dat1eTimeTickStrategy),
    )

If this TickStrategy would be supplied to an X-Axis, it would effectively mean that its scale would start from 1st of January 2002 14PM, so a XY-point with coordinates { x: 0, y: 0 } would be formated as { x: 1.1.2002 14:00, y: 0 }.

It is worth mentioning that big DateTime-intervals can produce severe precision problems (eq. when zooming in). The only way to battle this is by reducing the distance of timestamps from the active origin-date.