Scrolling Heatmap Aggregation

This example demonstrates Scrolling Heatmap Aggregation in HeatmapScrollingGridSeries. You can also configure aggregation for a static HeatmapGridSeries.

By default, heatmaps display the closest heatmap cell value to each pixel that is rendered on the screen. With dense, high resolution heatmaps, this can mean that there is no guarantee which data value is displayed in a pixel. Heatmap aggregation can be enabled to specify this behavior (which value to show when multiple cell values are contained by single pixel) at the expense of a performance hit.

In this example, the lower heatmap uses the max aggregation mode, making it much easier to identify signals in the data stream.

In LightningChart JS, aggregation mode is configured with the setAggregation method. By default the aggregation mode is undefined. Bilinear interpolation is not supported simultaneously, so remember to disable it with setIntensityInterpolation('disabled').

// Enable heatmap aggregation (max/min)
heatmapSeries
    .setAggregation('max')
    // Bilinear interpolation is not supported simultaneously
    .setIntensityInterpolation('disabled')