Creative Technologist, Data Scientist, Generative Artist (generatecoll)
p5((s) => {
let itr;
let c1, c2;
let pat;
// Color
let clr = 0;
let bg = getColor();
c1 = s.color(getColor());
c2 = s.color(getColor());
s.setup = function () {
s.createCanvas(W, H);
s.noStroke();
itr = 0;
pat = patern();
s.background(bg);
create_grid(0, 0, W, H, form.n_width);
};
s.draw = function () {
// s.background(bg);
};
const create_grid = (x, y, w, h, n) => {
let w_diff = w / n;
let h_diff = h / n;
s.push();
s.translate(x, y);
for (let i = 0; i < n; i++) {
for (let j = 0; j < n; j++) {
s.fill(pat[itr % pat.length]);
if (s.random() < form.prob) {
create_grid(
w_diff * j,
h_diff * i,
w_diff,
h_diff,
s.floor(s.random(6))
);
} else {
s.rect(
w_diff * j,
h_diff * i + 10 * s.sin(j * form.sin),
w_diff,
h_diff
);
}
if (s.random(1) < form.p_prob) {
pat = patern();
}
itr++;
}
}
s.pop();
itr = 0;
};
})
W = form.width
H = form.height
patern = () => {
let p = [];
for (let i = 0; i < form.n; i++) {
p[i] = getColor();
}
return p;
}
pattern = patern()
import { p5 } from "@tmcw/p5"
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.
