じょりじょり日記

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

Processing vol11

明日はベクトルに関すProcessingの写経会なのでベクトル項目をやってみました!

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

void setup() {
  size(640,360);
}

void draw() {
  background(0);
  
  //マウスのの位置ベクトルを設定
  //mouseXとmouseYはmouse.xとmouse.yで参照可能
  PVector mouse = new PVector(mouseX,mouseY);
  
  //中央の位置ベクトルを設定
  PVector center = new PVector(width/2,height/2);
  //中央からマウスまでのベクトルを計算
  mouse.sub(center);
  
  //normalizeは正規化という意味
  //これをPVectorにnormalizeするとあばばばばばば!!!!!1?になる
  mouse.normalize();
  
  //mouseのベクトルの長さを1*150で150にしている。
  mouse.mult(150);
  
  //lineを描画する座標を中央にする
  translate(width/2,height/2);
  stroke(255);
  strokeWeight(4);
  line(0,0,mouse.x,mouse.y);
  
}
//https://processing.org/examples/bouncingball.html
//ベクトル使いますよ!という宣言
PVector location;
PVector velocity;
PVector gravity;

void setup() {
  size(640, 360);
  //位置
  location = new PVector(100, 100);
  //速度
  velocity = new PVector(1.5, 2.1);
  //重力
  gravity = new PVector(0, 0.2);
}

void draw() {
  background(0);

  location.add(velocity);
  velocity.add(gravity);

  //locationはx方向に1.5ずつvelocityによって加算
  //そこでellipseが右までいったらx方向を逆に1.5ずつ加算
  if ((location.x > width) || (location.x < 0)) {
    velocity.x = velocity.x * -1;
  }
  //底を超えたら反発するためにvelocityにマイナスを掛ける
  if (location.y > height) {
    velocity.y = velocity.y * -0.95;
    //下でバウンドしているように見せるためにheightを位置ベクトルに代入?
    location.y = height;
  }

  
  stroke(255);
  strokeWeight(2);
  fill(127);
  ellipse(location.x, location.y, 48, 48);
}