Tutorials

/

p5.js Tutorials

/

Creating Classes

/

Recursive Lines

Previous:

Creating Classes

Recursive Lines

Click here to view this code in the p5 editor.

Click here to view the result by itself.

This sketch shows lines that draw other lines. Each line draws itself, and 3 other lines. Those 3 lines draw themselves, and each draws 3 more lines.

I created this for the 21st day of Genuary which had a prompt of:

function f(x) {
  DRAW(x);
  f(1 * x / 4);
  f(2 * x / 4);
  f(3 * x / 4);
}

Each line draws itself, and then spawns a new line at 25%, 50%, and 75% of its own length.

Remix Ideas

• Restart each line when with a new color when it finishes.
• Start each new line at a random angle.
• Base the line’s color off of it’s length. Make longer lines darker, or more red.

Previous:

Creating Classes