JSFiddle - React, Tailwind, and code Playground

by sebleedelisle

CSS

canvas {
    border:1px black solid;       
}

JavaScript

// recursion 2 //  

var canvas = document.createElement('canvas'); 
canvas.width = 400; 
canvas.height = 400; 
document.body.appendChild(canvas); 

var ctx = canvas.getContext('2d'),
    counter = 0; 

ctx.translate(200, 360); 
branch(60);

function branch(branchLength) { 
    counter++; 
    
    ctx.beginPath(); 
    ctx.moveTo(0, 0); 
    ctx.lineTo(0, -branchLength);
    ctx.stroke(); 
   
    ctx.translate(0, -branchLength);
    
    if(counter<=10) branch(branchLength);

}