p5.jsを使用して滑らかにアニメーション化されたフラクタルツリー

Question

p5.jsを使用して滑らかにアニメーション化されたフラクタルツリーを作成しようとしています。私は、同時にすべてを生成するのではなく、枝を1つずつ生成させる方法を全く知らない。任意のアドバイスのための

function draw() { 
    background(51); 
    strokeWeight(5); 
    stroke(255, 0, 0); 
    translate(600, height); 

    drawLine(300); 
} 

function drawLine(length) { 
    miliseconds = millis()/10; 
    if(miliseconds < length) { 
     line(0, 0, 0, -miliseconds); 
    } 
    else { 
     line(0, 0, 0, -length); 
    } 

    translate(0, -length); 

    if(length > 50) { 
     push(); 
     rotate(PI/4); 
     drawLine(length * 0.67); 
     pop(); 
     push(); 
     rotate(-(PI/4)); 
     drawLine(length * 0.67); 
     pop(); 
    } 
} 

ありがとう：

は、ここに私のコードです！

Answer 1

この質問はかなり広いです。スタックオーバーフローは、一般的な "どのようにこれを行うのですか？"というタイプの質問に対しては設計されていません。それは具体的なものです。「私はXを試しましたが、Yは期待されましたが、代わりにZを得ました。つまり、私は一般的な意味で助けようとします：

これを行う方法の1つは、フレームごとに描画された枝の数を追跡し、その限界に達するまで描画を続けます。これは、すべてのフレームをリセットするスケッチレベルの変数で行うことも、drawLine()関数の引数として渡すこともできます。

int currentLimit = 1; 

void draw(){ 
    exampleRecursiveFunction(0, currentLimit); 
    currentLimit++; 
} 

void exampleRecursiveFunction(int count, int limit){ 
    drawMe(); 
    if(count < limit){ 
     exampleRecursiveFunction(count+1, limit); 
    } 
} 

：

は、ここで私が話しているかの非常に非常に基本的な考えです