JavaScript High Precision Axis Chart - Editor

This example showcases the High Precision Axis XY feature.

An XY Axis can be marked with high precision mode when it is created, similarly how logarithmic axes are created.
This example shows how it is done for default X Axis.

const chart = lightningChart()
    .ChartXY({
        // Default Axis types can only be defined when chart is created.
        defaultAxisX: {
            type: 'linear-highPrecision',
        },
    })

High precision Axis behaves just like a normal linear Axis, but with two technical differences:

  1. There is a performance drop for all attached series. This is mostly an increase on GPU usage, which shows on low end devices the most, for example laptops with integrated GPUs.

  2. The Axis zoom range is significantly improved (read more below).

High Precision Axis XY currently supports all XY series types except Heatmap Series.

About Axis zoom range limits

LightningChart JS is easily the market leader in zooming interactions and visualization resolution, and contrary to most chart libraries, we are open about axis zooming limits.

The fact of the matter is that every kind of chart library has some limit to how small differences it can visualize. Ultimately the limits are dictated by the used technology (for us this is WebGL).

All veteran chart library developers have come across the issue sooner or later, when an user collides against this limit and the question is asked - how can we get higher precision? Usually this ends in decimating the end users data with tricks and gimmicks, which can lead to a working result but with the expense of user experience.

High Precision Axis XY feature is our reaction to a proper improvement to these limitations - it handles all the annoying stuff that users had to previously do in their application code and gives even better benefits;

Here are reference tables to the achievable zoom range with normal Axis vs High Precision Axis XY
(achievable zoom range depends on the magnitude of Axis interval start).

Normal Axis

Axis interval startMin intervalMax interval
01e-41e+16
1001e-21e+16
10 0001.001e+16
1 000 0001001e+16
Date.now() (UNIX)736000001e+16

High Precision Axis XY

Axis interval startMin intervalMax interval
01e-121e+30
1001e-101e+30
10 0001e-81e+30
1 000 0001e-61e+30
Date.now() (UNIX)1.001e+30