// 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.

Tool
Claude
Model
Opus 5
Type
Code
Date
Licence
Free to use, no conditions

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.