Die Garten

Inspired by Aleksandra Jovanić and Zancan's art style

Log in to post a comment.

// ── how many flowers and how big ──
const numFlowers = 12;  // min=1, max=100, step=1
const minSize    = 20;  // min=1, max=100, step=1
const maxSize    = 70;  // min=5, max=250, step=1
const spacing    = 100;  // min=-200, max=200, step=5
const numPetals  = 6;   // min=2, max=150, step=1
const stemLength = 50;  // min=0, max=150, step=2
const wobble     = 5;   // min=0, max=17, step=1

Canvas.setpenopacity(-0.6);
const turtle = new Turtle();

// ── simple random number helper ──
let seed = 42;
function random() {
    seed = (seed * 16807) % 2147483647;
    return (seed - 1) / 2147483646; // returns 0 to 1
}
function randomBetween(min, max) {
    return min + random() * (max - min);
}

// ── draw a stem straight down from (x, y) ──
function drawStem(x, y) {
    turtle.penup();
    turtle.goto(x, y);
    turtle.pendown();
    for (let i = 1; i <= 12; i++) {
        turtle.goto(
            x + (random() - 0.5) * wobble,  // ← jiggle
            y + stemLength * (i / 12)
        );
    }
}

// ── draw one petal pointing in a given angle ──
function drawPetal(x, y, angle, size) {
    const petalLength = size;
    const petalWidth  = size * 0.25;
    const pts = 20;

    turtle.penup();
    turtle.goto(x, y);
    turtle.pendown();

    // left edge: from base to tip
    for (let i = 0; i <= pts; i++) {
        const t = i / pts;
        const along = petalLength * t;         // how far along the petal
        const across = petalWidth * Math.sin(t * Math.PI); // how wide at this point
        turtle.goto(
            x + Math.cos(angle) * along - Math.sin(angle) * across,
            y + Math.sin(angle) * along + Math.cos(angle) * across
        );
    }

    // right edge: from tip back to base
    for (let i = pts; i >= 0; i--) {
        const t = i / pts;
        const along = petalLength * t;
        const across = petalWidth * Math.sin(t * Math.PI);
        turtle.goto(
            x + Math.cos(angle) * along + Math.sin(angle) * across,
            y + Math.sin(angle) * along - Math.cos(angle) * across
        );
    }
}

// ── draw a wobbly circle (like a contour line) ──
function drawWobblyCircle(x, y, radius, phase) {
    const pts = 36;
    turtle.penup();
    turtle.goto(x + radius, y);
    turtle.pendown();

    for (let i = 1; i <= pts; i++) {
        const angle = (i / pts) * Math.PI * 2;
        // add wobble using sine waves
        const r = radius
            + Math.sin(angle * 2 + phase) * wobble * 0.6
            + Math.sin(angle * 3 + phase) * wobble * 0.4;
        turtle.goto(x + Math.cos(angle) * r, y + Math.sin(angle) * r);
    }
}

// ── draw one complete flower ──
function drawFlower(x, y, size) {

    // 1. stem
    drawStem(x, y);

    // 2. petals — evenly spaced around the center
    for (let i = 0; i < numPetals; i++) {
        const angle = (i / numPetals) * Math.PI * 2; // spread around full circle
        drawPetal(x, y, angle, size);
    }

    // 3. two wobbly rings at the center (like Zancan's contour style)
    drawWobblyCircle(x, y, size * 0.15, 0);
    drawWobblyCircle(x, y, size * 0.30, 1.5);
}

// ── place all flowers on a loose grid ──
const cols = Math.ceil(Math.sqrt(numFlowers)); // how many columns

for (let i = 0; i < numFlowers; i++) {
    const col = i % cols;
    const row = Math.floor(i / cols);

    // grid position, then nudge randomly so it's not too rigid
    const x = (col - cols / 2) * spacing + randomBetween(-10, 10);
    const y = (row - cols / 2) * spacing + randomBetween(-10, 10);

    // random size for each flower
    const size = randomBetween(minSize, maxSize);

    drawFlower(x, y, size);
}