じょりじょり日記

JavaScript100サイトチャレンジを記録するブログです。

JavaScriptチャレンジ Processing vol6

くぅー、今日も全然わからなかったです。
明日はもっと理解が深まるように頑張りたいですね!
%で余りを活用する…とかなると一気にわからなくなってしまいます。

具体的な値をいれてみるにしてもちょっと難しいですね。。悔しい、がんばります。

f:id:zyoryzyory:20170907005613p:plain

https://processing.org/examples/storinginput.html

int num = 60;
//60個の配列を用意
float mx[] = new float[num];
float my[] = new float[num];

void setup() {
  frameRate(60);
  size(640, 360);
  noStroke();
  fill(255, 153); 
}

void draw() {
  background(51); 
  
  //frameRateによって描画された回数をnumで割った余りをwhichに定義
  //frameRateのDefaultは60だから1秒あたり60個もの数値がwhichには代入される 
  int which = frameCount % num;
  print(which);
  
  //1秒間に60個もの数値が流れる配列の中にmouseX, Yの軌跡は記録されていく
  mx[which] = mouseX;
  my[which] = mouseY;
  
  for (int i = 0; i < num; i++) {
    //which+1にするとmx, myの配列の末尾を参照できる
    //配列の末尾に i をnum分足していくことで一体何が…。
    //配列が古くなっていくとellipseが小さくなる…?
    int index = (which+1 + i) % num;
    ellipse(mx[index], my[index], i, i);
  }
}