Scrolling Heatmap

This example shows a simple use-case scenario for a Heatmap, with a toggleable mode for either scrolling or sweeping update of the values.

When adding data to a Heatmap, users can use two different methods. The first ones, addColumn and addRow, always add data to the end
of the Matrix (horizontally or vertically, respectful of which method is used) and shift the previously added data to accommodate the new data.

// Add new column to the end of the Matrix. In most cases, this would be the right-most column in the Heatmap.
// Older data gets shifted to the left by one column.
grid.addColumn(1, 'value', [values])

Additionally, it is possible to use the invalidateValuesOnly method to replace data in the Heatmap. This is useful when creating a sweeping
update for the Heatmap.

// Use invalidateValuesOnly to change values in the Matrix with values we want.
grid.invalidateValuesOnly(
    // New data for the Heatmap.
    remappedData,
    {
        // Columns to modify: In this example, we're only changing one column worth of data.
        column: { start: ind, end: ind + 1 },
        // Rows to modify: In this example, all the rows in a single column need to be changed, so
        // we start from the first index and end in the last.
        row: { start: 0, end: resolution - 1 }
    }
)