在javascript中创建动画循环（canvas）

我做了一个绘制40个矩形的循环，它们都需要有高度：400px;但我想从高处开始：0;和动画到400这是我的代码：在javascript中创建动画循环（canvas）

function draw(){ 

    height += 5; 
     if(height > 1){ 
      for (var i = 0; i < 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); 
    }

来源

2015-05-14 user3441089

最新问题？什么部分是/不工作？你需要什么帮助？ – atmd

如果我做日志，我可以看到我的身高正在上升，但是我的矩形只是在5px高度处绘制并停下来。 – user3441089

你能显示完整的代码吗？或更好，但在jsfiddle重新创建？ – atmd

的问题是，第二次draw被调用，xPos = 907，第三次draw被称为xPos = 1804等

你想xPos，geel ，blauw和groen都被定义为里面的draw这样它们每次都会重置。这是一个fiddle。

来源

2015-05-14 14:43:08 JosiahDaniels

非常感谢！，现在我仍然有一个小问题，实际上根据dataSales []，条应该变高，就像height = dataSales [i]/800，有没有办法做到这一点？ – user3441089

https://jsfiddle.net/a0b4mu2y/1/ – JosiahDaniels

在javascript中创建动画循环（canvas）

回答

相关问题