Ph.D. Student at UC Berkeley EECS. Prev. @FormidableLabs.
Public
Edited
Jan 23, 2022
2 stars
wolframAutomata = {
const ruleset = ruleNumberToRuleset(ruleNumber);
const cells = [initialCells];
let nextGenerationCells = initialCells;
for (let i = 1; i < numCells; i++) {
const generation = i;
nextGenerationCells = generate(generation, nextGenerationCells, ruleset);
cells.push(nextGenerationCells);
}
const [onRects, offRects] = cells.reduce((genAcc, generation, genI) => {
const [genOnCells, genOffCells] = generation.reduce((cellAcc, cell, i) => {
const isFilled = cell === 1;
const fill = isFilled ? '#000000' : '#ffffff';
const node = svg`
<rect
x=${i * cellSize}
y=${genI * cellSize}
width=${cellSize}
height=${cellSize}
fill=${fill}
stroke="#000000"
stroke-width="0.25"
>
`;
if (isFilled) {
cellAcc[0].push(node);
} else {
cellAcc[1].push(node);
}
return cellAcc;
}, [[], []]);
genAcc[0].push(genOnCells);
genAcc[1].push(genOffCells);
return genAcc;
}, [[], []]);
return svg`
<svg
viewBox="0 0 ${width} ${height}"
width=${width}
height=${height}
stroke="#000000"
stroke-width="0.25"
>
<g id="off">${offRects.flat()}</g>
<g id="on">${onRects.flat()}</g>
</svg>
`
}
ruleNumberToRuleset = (n) =>
("00000000" + n.toString(2)).slice(-8)
.split("")
.map((n) => parseInt(n, 10))
.reverse();
rules = ({ left, center, right }, ruleset) => {
const index = parseInt(`${left}${center}${right}`, 2);
return ruleset[index];
};
generate = (generation, cells, ruleset) => {
const nextGeneration = new Array(cells.length)
.fill()
.map((_, i) => {
const left = cells[i - 1] || 0;
const center = cells[i];
const right = cells[i + 1] || 0;
return rules({ left, center, right }, ruleset);
});
return nextGeneration;
};
import {Range} from "@observablehq/inputs"
width = numCells * cellSize;
height = numCells * cellSize;
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.
