drie Lindemayer boompjes

drie Lindemayer boompjes. terug naar de inleiding naar de drie Lindemayer boomjes in fullscreen

De schets maakt gebruik van objecten van de class "Text" en de superclass "Vormen" (dit omdat "Text" een subclass is van "Vormen"0

Kenmerken van een L system

1) Alphabet waarin je aangeef welke karaters in het L system zijn toegestaan. Hier zij dit de vijf karakters F [ + ] en -

2) Axioma zijn de karakters waarmee je start hier is dat de F

3) De rules of regels voor boomje a F --> F[+F]F[-F]F (is de startzin) . F wordt in 5 iteraties (regel 108) bij deze startzin opgeteld (regel 50)

Zo onstaat een lange zin (wordt in het console geprint zie regel 60), De karakters in deze zin worden in de functie Turtle (regel 63) omgezet in lijntjes

F is een lijn (regel 69) met lengte 2*n (regel 11). Met + en - wordt de lijn geroteerd (regel 90 voor boompje a).

De [ en ] tekens zorgen voor push en pop zodat alleen het betreffend lijntje de rotatie krijgt,

dit samen met translate (regel 70) waardoor het canvas weer in de oorspronkelijke positie komt

De functie wordt Turtle genoemd omdat er karakters worden omgezet in vormen die een bepaald gedrag vertonen, ook wel turtle graphics genoemd,

Turtle graphics is ook een methode waarmee kinderen leren progammeren in de programmeertaal python

 
let zin = "F"; let teller;
let len; let x; let y; let n; 
let regels = [];
let hoek;
 
function setup() {
  createCanvas (windowWidth, windowHeight);
  y = height/2; x = width/2;
  n = height/20;
  len = 2*n;
  teller = 0;
//  ruitjespap = new Ruitjes(n, x, y);
  text1 = new Text("toets g is de groeitoets",0.8*n,1,x-15*n,y-8*n,0,3,
  color(200,0,250,150),2,color(-0,255,255,150));
  text2 = new Text("toets a is boompje a", 0.8*n,1,x-15*n,y-7*n,0,3,
  color(200,0,250,150),2,color(-0,255,255,150));
  text3 = new Text("toets b is boompje b", 0.8*n,1,x-15*n,y-6*n,0,3,
  color(200,0,250,150),2,color(-0,255,255,150));
  text4 = new Text("toets c is boompje c", 0.8*n,1,x-15*n,y-5*n,0,3,
  color(200,0,250,150),2,color(-0,255,255,150));
  //De regels vastleggen in een array van dicts
  //voor het Lindemayer system wordt er maar een array cel gebruikt
  regels[0] = { a: "F", b: "F[+F]F[-F]F"} //a
  hoek = radians(25.7);
}
 
function draw() {
  background(230,251,255);
//  ruitjespap.show();
  text1.display();
  text2.display();
  text3.display();
  text4.display();
  stroke(0);
  turtle();
}
//de functie om de  Lindemayer zin op te bouwen
function linZin() {
  //in onderstaande code wordt bij de eerste stap Axioma F in volgende gestopt
  len *= 0.5;
  let volgendeZin = "";
  for (let i = 0; i < zin.length; i++) {
    let volgende = zin.charAt(i);
 
    let found = false;
    for (let j = 0; j < regels.length; j++) {
      if (volgende == regels[j].a){
        found = true;
        volgendeZin += regels[j].b;
        break;
    }
  }
     if (!found) {
      volgendeZin += volgende; //voor het geval  a: ""
   }
}
// de volgende zin wordt nu de oorspronkelijke zin dus
   zin = volgendeZin;
   console.log(zin);
}
 
function turtle() {
  translate(width/2, height);
  for (let i = 0; i < zin.length; i++) {
    let volgend = zin.charAt(i);
 
    if (volgend == "F") {
      line(0, 0, 0, -len);
      translate(0, -len); //door deze translate ga je naar het eindpunt van de lijn
    } else if (volgend == "+") {
      rotate(-hoek);
    } else if (volgend == "-") {
      rotate(hoek);
    } else if (volgend == "[") {
      push();
    } else if (volgend == "]") {
      pop();
    }
  }
}
 
function windowResized() {
  resizeCanvas(windowWidth, windowHeight);
}
 
function keyPressed() {
 if (key == 'a') {
    teller = 0;
    zin = "F"; len = 2*n; hoek = radians(25.7);
    regels[0] = { a: "F", b: "F[+F]F[-F]F"}   //a
    draw();
}
 if (key == 'b') {
    teller = 0;
    zin ="F"; len = 10*n; hoek = radians(20);
    regels[0] = { a: "F", b: "F[+F]F[-F][F]"}  //b
    draw();
}
 if (key == 'c') {
    teller = 0;
    zin ="F"; len = 5*n; hoek = radians(22.5);
    regels[0] = { a: "F", b: "FF-[-F+F+F]+[+F-F-F]"}  //c
    draw();
}
 if (key == 'g') {
    teller = teller + 1;
    if (teller < 6){
     linZin();
   }
  }
}

Flevopink