// Giardino generativo — nessuna libreria, solo canvas.
// Lo stesso seme dà sempre la stessa pianta. Semi diversi, piante diverse.
function seme(testo) {
let h = 2166136261 >>> 0;
for (const c of testo) { h ^= c.charCodeAt(0); h = Math.imul(h, 16777619); }
return () => {
h += 0x6D2B79F5;
let t = Math.imul(h ^ (h >>> 15), h | 1);
t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
};
}
function pianta(ctx, testo, x, y) {
const r = seme(testo);
const foglie = 3 + Math.floor(r() * 5);
const tinta = 80 + r() * 60;
(function ramo(x, y, lung, ang, spessore, vita) {
if (vita === 0 || lung < 3) return;
const x2 = x + Math.cos(ang) * lung;
const y2 = y + Math.sin(ang) * lung;
ctx.strokeStyle = `hsl(${tinta} ${30 + vita * 6}% ${18 + vita * 5}%)`;
ctx.lineWidth = spessore;
ctx.lineCap = "round";
ctx.beginPath();
ctx.moveTo(x, y);
ctx.quadraticCurveTo(x + Math.cos(ang - .3) * lung * .6, y + Math.sin(ang - .3) * lung * .6, x2, y2);
ctx.stroke();
if (vita === 1) {
ctx.fillStyle = `hsl(${tinta + 20} 55% 55% / .8)`;
ctx.beginPath();
ctx.ellipse(x2, y2, 4 + r() * 5, 2 + r() * 3, ang, 0, 6.3);
ctx.fill();
return;
}
for (let i = 0; i < 2 + Math.floor(r() * (foglie - 1)); i++) {
ramo(x2, y2, lung * (.62 + r() * .22), ang + (r() - .5) * 1.1, spessore * .68, vita - 1);
}
})(x, y, 60 + r() * 30, -Math.PI / 2, 7, 6);
}
// uso: pianta(canvas.getContext('2d'), 'il nome di chi vuoi', 300, 480);Giardino generativo
Quaranta righe che fanno crescere una pianta diversa per ogni seme che gli dai. Dalla collezione di apertura.
Prompt
Scrivi in JavaScript puro, senza librerie, un generatore di piante: dato un seme testuale deve disegnare su canvas una pianta sempre uguale a se stessa per quel seme e diversa da tutte le altre.