title: Animating a for loop in javascript (canvas)
body: <p>I made a for loop which draws 40 rectangles , they all need have height: 400px; but I want to start at height: 0; and animate to 400 with <code>requestAnimationFrame</code> This is my code :</p>
  
  <pre><code>function draw(){
  
      height += 5;
          if(height &gt; 1){
              for (var i = 0; i &lt; dataSales.length; i++) {
  
                      geel += 6;
                      blauw += 6;
                      groen -= 6;
                      xPos += 23;
                      ctx.beginPath();
                      ctx.fillStyle= "#89C349";
                      ctx.rect(xPos,595,20,-height);
                      ctx.fill();
              }
          }
      window.requestAnimationFrame(draw);
      }
  </code></pre>