createQuadrille(width, height, predicate, value)

Creates a quadrille of the specified size and fills each cell only if the given predicate({ row, col }) returns true. The filled cells are assigned the provided value.

This method is ideal for generating patterns like diagonals, borders, checkerboards, or any logical layout based on cell position.

Example #

(fill the two diagonals with 🌀 symbols)

code

Quadrille.cellLength = 50;
let q;

function setup() {
  createCanvas(8 * Quadrille.cellLength, 8 * Quadrille.cellLength);
  q = createQuadrille(8, 8, ({ row, col }) => row === col || row + col === 7, '🌀');
}

function draw() {
  background('beige');
  drawQuadrille(q);
}

Syntax #

createQuadrille(width, height, predicate, value)

Parameters #

Param	Description
`width`	Number: total number of columns in the quadrille
`height`	Number: total number of rows in the quadrille
`predicate`	Function: receives `{ row, col }` and returns `true` if the cell should be filled
`value`¹	Any: the value to assign to matching cells. Can be a literal, function, or object

If value is a function, it is evaluated per cell. Use Quadrille.factory(({ row, col }) => new Object(...)) to generate a new object per cell. For display routines, use a plain function like ({ row, col, options }) => { ... }. See options for available parameters. ↩︎