Código html (index.html):
<!doctype html> <html> <head> <title>Fractal</title> <script src="libraries/p5.js"></script> <script src="libraries/p5.dom.js"></script> <script src="code.js"></script> </head> <body style="text-align:center; margin:0px"> </body> </html>
Código p5.js (code.js):
var slider;
function setup(){
createCanvas(500,500);
slider = createSlider(0, 3*PI/4, PI/8, PI/512);
slider.position((windowWidth/2)-(width/2)+10, 10);
}
function draw(){
background(255,215,0);
angulo = slider.value();
stroke(0);
strokeWeight(1);
translate(width/2, height);
rama(140);
}
function rama(longitud){
line(0, 0, 0, -longitud);
translate(0, -longitud);
if (longitud > 4) {
push();
rotate(angulo);
rama(longitud * 0.667);
pop();
push();
rotate(-angulo);
rama(longitud * 0.667);
pop();
}
}
