L-Systems

Go back

Settings






Preview

Help

This pane will help you understand the settings in the left pane.

Grammar & Turtle commands

Here you can define the actions associated with a letter that can be used to produce pretty images:
letter: action{paramter}; action{paramter}; ...
letter: action{paramter}; action{paramter}; ...
;; A comment line starts with two semicolons. Inline comments are not allowed.
... Letter is a single character, followed by a colon. The allowed actions are the following:

  • draw_forward{length}: Move the turtle foward while drawing a line
  • jump_forward{length}: Move the turtle foward without drawing a line
  • turn_left{angle}: Turn the turtle angle degrees to the left
  • turn_right{angle}: Turn the turtle angle degrees to the right
  • save_state: Save the current state (position & direction)
  • restore_state: Pop a saved state off the stack and restore it
  • set_direction{angle}: Set the direction to angle
  • set_position{[x, y]}: Set the absolute position to (x, y)
  • no_operation: Do nothing
  • set_color{color} changes the stroke color to color
  • set_linewidth{width} sets the linewidth of the segments. x: set_linewidth{this.iteration} will increase the line width with every iteration a bit because the final image is often scaled down. Do not forget to add x to your axiom!
  • dump_state: dump the current state. This is useful for debugging, so you probably do not need this. To see the dumped state, open the development console (press F12) and navigate to the console tab.

Axiom

The axiom is the starting point. From there the application of replacement rules will hopefully lead you to some amazing fractals!

Replacement Rules

The core of an L system is the set of replacement rules that determine the changes when iterating. A rule consists of two parts:

  1. A letter to replace.
  2. A word (sequence of letters) to replace the letter with.

Similar to the syntax you already know from the grammar definition, you can simply define replacement rules like this: <letter a>: <letter a1><letter 2><letter a3>...
<letter b>: <letter b1><letter b2>...
 E. g.: F: GFLFRRFFLLFRFG
G: GG
 Note that comments are not allowed!

Tips & Tricks

To simplify the implementation of this mini programming language, a bad practice is used: the parameters are parsed and executed as JavaScript. That is probably not ideal, but it enables us to do quite fancy stuff:

  • We know in which state the turtle is. As you have already seen, we can access the current iteration number with this.iteration.
  • We can use math: F: draw_forward{Math.sqrt(1764)}
  • We can introduce randomness: Just use Math.rand(min, max) and Math.randNorm(avg, std), e. g.: F: draw_forward{Math.randNorm(50, 10)}
    G: set_direction{Math.rand(0, 2 * Math.PI)}     The first macro draws a line with a length that is normally distributed around 50 with a standard deviation of 10. The second macro chooses a random direction.