Published
Edited
Apr 22, 2019
Importers
Also listed in…
UI
md`# Grids
`
sample = f=>[...Array(400)].map((x,xi)=>f(xi/200-1))
function grid(cfg) {
let {rows=5, cols=5, padx=5, pady=5, dx=50, dy=50, sx=0, sy=0} = cfg;
// let rows = A.length;
// let cols = A[0].length;
let elems = [];
for (let i=0; i<rows; i++)
for (let j=0; j<cols ; j++) {
let a = {};
a.row = i;
a.col = j;
a.x0 = j * (dx + padx) + sx;
a.y0 = i * (dy + pady) + sy;
a.xc = a.x0 + dx / 2;
a.yc = a.y0 + dy / 2;
a.x1 = a.x0 + dx;
a.y1 = a.y0 + dy;
a.dx = dx;
a.dy = dy;
elems[elems.length] = a;
}
return elems;
}
rows_cols = calc_rows_cols ({width:width, height:height, dx:50, dy:50})
function calc_rows_cols(cfg) {
let {width=250, height=250, dx=50, dy=50} = cfg;
let rows = Math.floor(height / dx);
let cols = Math.floor(width / dy);
return {rows:rows, cols:cols}
}
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.
