p5.jsにランダムに配置された楕円をループする方法は？

Question

私は、キャンバス全体に小さな楕円を描画するループをp5.js内に作成しようとしています。私は前にこのようなことをしてきましたが、コードは異なっていました。私はループを試してみたかっあり 、私が入力しなければならなかったすべてはした

for (var i = 0; i < 200; i++) {} 

私は（メイク：p5.js入門）を使用しているマニュアルは、コードと言われますこれを行うには似ています。

for (var i = 20; i < 400; i += 8) { 
     line(i,40,i+60,80) 
    } 

しかし、私はこのコードを入力してテストしても動作しません。誰かが画面上に複数の小さな楕円を描く方法を説明することはできますか（私は、楕円のx座標とy座標がランダムになるように変数を設定しています）

EDIT：これは、コードのよりフルバージョンです：

function draw() { 
     noStroke(); 
     fill(fishCr,fishCg,fishCb); 
     arc(ellX,ellY,ellW,ellH,0,180); 
     arc(ellX+5,ellY-10,ellW/1.5,ellH/1.5,arcEl,50); 
     arc(ellX-45,ellY+20,ellW/1.5,ellH*1.5,340,110); 
     arc(ellX-60,ellY-10,ellW/1.5,ellH*2,arcT,40); 
     fill(0,200,255,0.5); //this is the start of the code in     
          //question 
     for (var i = 0; i < 200; i++) { 
      ellipse(bubX,bubY,5,5); 
     } 
    } 

Answer 1

createCanvas(500, 500); 

function setup() { 
    for (var i = 0; i < 200; i++) { 
    ellipse(random(0, width), random(0, height), 5); 
    } 
} 

これはキャンバスを作成し、ランダムな場所に200個の小さな円を描画します。 あなたはこれを探していますか？

Answer 2

それは動作しませんと言ってより具体的にしてみてください。何が起こりますか？ the JavaScript consoleには何が表示されますか？

forループのチュートリアルも参照してください。 HereはProcessing用に書いたものですが、基本的な考え方は同じです。

最初のforループは0で始まり、1になり、200に達するまで増加します。あなたの第2のforループは20から始まり、8になり、400に達するまで増加します。

また、2番目のforループに余分な中括弧{があることに注意してください。

まだ解決できない場合は、問題を示すMCVEを投稿してください。がんばろう。

編集：あなたforループを見てみましょう：

for (var i = 0; i < 200; i++) { 
    ellipse(bubX,bubY,5,5); 
} 

ここでは、200円を描画しているが、あなたはbubXとbubYに基づいて、同じ場所でそれらのすべてを描画しています変数。毎回同じ変数の代わりにランダムな値を渡したいと思うかもしれません。