JS API

grid

Read the dimensions of the rendered grid, or set the grid attribute.

Syntax

  • doodle.grid
  • doodle.grid = '5x4'

The getter returns { x, y, z, count, ratio }: columns, rows, depth, the number of cells and x / y. It reflects the grid in use, which comes from the @grid property when the code has one. The setter writes the grid attribute, which re-renders the doodle unless the code sets its own @grid.

Examples

const doodle = document.querySelector('css-doodle');

doodle.grid = '3x4';

console.log(doodle.grid);
// { x: 3, y: 4, z: 1, count: 12, ratio: 0.75 }

See also