Published
Edited
Oct 26, 2020
1 fork
1 star
{
const context = DOM.context2d(width, 300);
context.canvas.style.imageRendering = "pixelated";
context.canvas.style.background = "#fff";
context.scale(0.5, 0.5);
drawGrid(context, cellSize);
const totalRows = Math.round(context.canvas.height / cellSize);
const totalCols = Math.round(context.canvas.width / cellSize);
const totalBoxes = totalRows * totalCols;
let j = 0;
do {
const r = Math.random() * 100;
const isEven = j % 2 === 0;
if (isEven) {
for (let i = 0; i <= totalCols; i++) {
fillCell(context, i,j, sinebow(i/r));
yield context.canvas;
}
} else {
for (let i = totalCols; i >= 0; i--) {
fillCell(context, i,j, sinebow(i/r));
yield context.canvas;
}
}
j++;
} while (j <= totalRows);
return context.canvas;
}
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.
