viewof number = Inputs.text({label: "Number"})
primeFactors(number)
p5((sketch) => {
sketch.setup = function () {
sketch.createCanvas(50, 50);
};
sketch.draw = function () {
let digits = Array.from(String(number), Number);
let numCols = digits.length;
digits.map((digit, i) => {
let factors = primeFactors(digit);
let numRows = factors.length;
factors.map((x, j) => {
sketch.fill(color(x));
sketch.stroke("white");
sketch.strokeWeight(2);
sketch.rect(0 + i*50/numCols, 0 + j * 50 / numRows, 50 / numCols, 50 / numRows);
});
});
};
})
strokeWeight=0.7
numSquaresRow = 30
sketchSize = 600
p5(sketch => {
sketch.setup = function() {
sketch.createCanvas(width, 50);
};
sketch.draw = function() {
[...Array(8).keys()].map((x,_) => {
sketch.fill(color(x+1));
sketch.noStroke();
sketch.rect(0 + 50*x,0,50,50);
sketch.fill("black");
sketch.stroke("black");
sketch.text(x+1,25+ 50*x,25);
})
};
})
import {p5} from "@tmcw/p5"
// from https://stackoverflow.com/questions/39899072/how-can-i-find-the-prime-factors-of-an-integer-in-javascript
function primeFactors(n) {
const factors = [];
let divisor = 2;
let original = n;
while (n >= 2) {
if (n % divisor == 0) {
factors.push(divisor);
n = n / divisor;
} else {
divisor++;
}
}
return original == 1 || (factors.length == 1 && original > 10) ? [1] : factors;
}
d3["interpolateRainbow"](0)
function color(number) {
return d3["schemeSet1"][[0, 4, 5, 2, 1, 3, 3][number - 1]];
}
[...Array(10).keys()]
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.
