Chiffre de départ de fractale

Question

Affectation graphique de l'ordinateur pour dessiner une fractale à l'aide de transformations webgl et affines.

Je ne peux pas comprendre quelle figure je devrais dessiner dans la fonction drawFigure() ou ai-je même pris la bonne approche au problème.

Jusqu'à présent, c'est que je tout réussi à faire:

var canvas = document.getElementById("fractal") 
 
     , ctx = canvas.getContext("2d") 
 
     , depth = 6 
 
     , HEIGHT = canvas.height 
 
     , WIDTH = canvas.width; 
 

 

 
    function drawFigure(color) { 
 
     ctx.beginPath(); 
 
     ctx.fillStyle = color; 
 
     ctx.fillRect(WIDTH * 0.25, HEIGHT * 0.25, WIDTH * 0.5, HEIGHT * 0.5); 
 
     ctx.fill(); 
 
    } 
 

 
    function drawFractal(depth, color, k) { 
 
     if (depth == 0) { 
 
      drawFigure(color);  
 
      return; 
 
     } 
 

 
     k = k || 1; 
 

 
     // NW 
 
     ctx.save(); 
 
     ctx.transform(0.5, 0, 0, 0.5, 0, 0); 
 
     drawFractal(depth - 1, color || "#FF0000", k * (-1)); 
 
     ctx.restore(); 
 

 
     // NE 
 
     ctx.save(); 
 
     ctx.transform(0.5, 0, 0, 0.5, WIDTH/2, 0); 
 
     drawFractal(depth - 1, color || "#00FF00", k); 
 
     ctx.restore(); 
 

 
     // SW 
 
     ctx.save(); 
 
     ctx.transform(0.5, 0, 0, 0.5, 0, HEIGHT/2); 
 
     drawFractal(depth - 1, color || "#0000FF", k); 
 
     ctx.restore(); 
 

 
     // SE 
 
     ctx.save(); 
 
     ctx.transform(-0.25 * k, 0, 0, 0.25 * k, 0.75 * WIDTH, 0.75 * HEIGHT); 
 
     drawFractal(depth - 1, color || "#FF00FF", k); 
 
     ctx.restore(); 
 
    } 
 

 
    drawFractal(depth);

<canvas width="600" height="600" id="fractal"></canvas> \t

Le but est de faire fractale qui ressemble à ceci:

Answer 1

J'ai réussi à comprendre moi-même. Tout ce que je devais faire est de trouver quand k retourner < 0. parvins en changeant:

if (depth == 0) { 
    drawFigure(color); 
    return; 
} 

à

if (depth == 0) { 
    if (k < 0) { 
     ctx.translate(WIDTH, HEIGHT); 
     ctx.scale(-1, -1); 
    } 
    drawFigure(color); 
    return; 
}