Map-backed

ixfx’s grids are not data structures in the sense of ways of storing & recalling data. It does offer array-backed value storage which can be useful for representing an image or numerical data.

A sparse grid is one that is mostly empty. Although it is defined as having a certain number of rows and columns, there actually isn’t much data at those locations. When using an array, we still have to create the array of the full size and fill it with empty values. This can be wasteful or if we’re talking about really huge grids, impractical

Using a Map to store data is one alternative. In this case, we only store the values which are actually added. There’s no need to store anything for cells that don’t exist.

ixfx doesn’t offer much help for this approach, but it’s easy to DIY. We’ll use Grids.cellKeyString to generate a string key for a cell position. With this, we can easily use a map for setting and getting data.

// Create the map and grid
const map = new Map();
const grid = { rows: 10_000, cols: 10_000 };

Now we need a function to store data in the map based on a cell position

const mapSet = (cell, value) => {
  map.set(Grids.cellKeyString(cell), value);
}

// eg: mapSet({ x:10, y:20 }, `blah`)

And a function to read data:

const mapGet = (cell) => map.get(Grids.cellKeyString(cell));

// eg. mapGet({ x:10, y:20 })