function grid(size, count, maxWidth) {
const ret = {
squares: [],
neighbors: [],
matrix: {},
rows: Math.ceil(count / Math.floor(maxWidth / size)),
columns: Math.floor(maxWidth / size)
};
for (let i = 0; i < count; i++) {
const x = (i % Math.floor(maxWidth / size)) * size,
y = Math.floor(i / Math.floor(maxWidth / size)) * size;
const square = {
// index
i: i,
// top left x position
x: x,
// top left y position
y: y,
// center x position
cx: x + size / 2,
// center y position
cy: y + size / 2,
// matrix x index
mx: x / size,
// matrix y index
my: y / size
};
ret.squares.push(square);
ret.matrix[`${square.mx},${square.my}`] = i;
// left
if (square.mx != 0) {
ret.neighbors.push([i, ret.matrix[`${square.mx - 1},${square.my}`]]);
}
// top
if (square.my != 0) {
ret.neighbors.push([i, ret.matrix[`${square.mx},${square.my - 1}`]]);
}
}
return ret;
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
