"X": "F+[[X]-X]-F[-FX]+X",

  "F": "FF"

}

​

let len = 3;

let ang;

​

let drawRules;

​

let word = "X";

​

function setup() {

  createCanvas(400, 400);

  ang = 25;

  drawRules = {

    "F": () => {

      stroke(100, 50, 0);

      line(0, 0, 0, -len);

      translate(0, -len);

    },

    "+": () => {

      rotate(PI/180 * -ang);

    },

    "-": () => {

      rotate(PI/180 * ang);

    },

    "[": push,

    "]": () => {

      noStroke();

      fill(0, 200, 0);

      ellipse(0, 0, 2 * len, 5 * len);

      pop();

    },

  }

  noLoop();

}

​

function draw() {

  background(220);

  push();

  translate(width/4, height);

  rotate(PI/180 * ang);

  for(let i = 0; i < word.length; i ++) {

    let c = word[i];

    if(c in drawRules) {

      drawRules[c]();

    }  

  }

  pop();

}

​

function mouseReleased() {

  word = generate();

  draw();

}

​

function generate() {

  let next = ""

  for(let i = 0; i < word.length; i ++) {

    let c = word[i];

    if(c in rules) {

      next += rules[c];

    } else {

      next += c;

    }

  }

  return next;

}