@ccueil Colles

Fractale de Sierpinski

Construction aléatoire: jeu du chaos



Fractale de Sierpinski

Code pour jeu du chaos

et le code complet:
  • form et input: sélection du nombre de points et interaction avec le canvas:
    <form onchange="Drawh()" onsubmit="Drawh();return false;" >
    <label>Nombre de points:</label>
    <input type="number" id="Nch" min="0" value="1000" max="100000" step="1" size="10">
    </form>
    
    Le canvas, zone graphique où se passe la représentation animable,
    <canvas id="spih" width="400" height="400" style="border:1px solid black"></canvas>
    
  • et le programme javascript à proprement parler:
    <script>
    canvash = document.getElementById("spih");
    ctxh = canvash.getContext("2d");
    Width=document.getElementById("spih").width;
    Height=document.getElementById("spih").height;
    
    function milieux(A,B) {
        //return C milieu de [AB]
        xC=(A[0]+B[0])/2
        yC=(A[1]+B[1])/2
        return [xC,yC] 
    }
    
    function Drawh() {
    x=0.5;y=0.5;
     ctxh.clearRect(0,0,Width,Height);
     Nch=document.getElementById("Nch").value;
      for (i=1;i<Nch;i++) {
        p=Math.random();
        if (p<1/3) {// M est le milieux de [AM], avec A(0,0)
          x=(0+x)/2;y=(0+y)/2;}
        else if (p<2/3) {// M est le milieux de [BM], avec B(0,Width)
          x=(0+x)/2;y=(Width+y)/2;}
        else {// M est le milieux de [CM], avec C(Height,Width)
          x=(Height+x)/2;y=(Width+y)/2;}
        ctxh.fillStyle="blue";
        ctxh.fillRect(x,y,1,1);
      }
    }
    Drawh();
    </script>
    
  • Avec une IFS


Voir aussi: