じょりじょり日記

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

Processing vol12

draw系やってみました!
徐々にですが「これができるんだったら、あれもできるかな?」と考えられるようになってきました。
とても楽しいです、どんどん続けていきますよ〜!

f:id:zyoryzyory:20170915003803p:plain

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

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

void draw() {
  stroke(255);
  if (mousePressed == true) {
    //currentとpreviousでverticalとhorizonの距離を取ってlineで結んでいるんだ
    line(mouseX, mouseY, pmouseX, pmouseY);
  }
}

f:id:zyoryzyory:20170915003822p:plain

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

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

void draw() {
  variableEllipse(mouseX, mouseY, pmouseX, pmouseY);
} 

//currentとpreviousの距離によってellipseのサイズが変わる関数
//frameRateはdefaultで60だからビューンと早くmouseを動かせば
//それだけ1描画あたりの距離が広がる
void variableEllipse(int x, int y, int px, int py) {
  float speed = abs(x-px) + abs(y-py);
  stroke(speed);
  ellipse(x, y, speed, speed);
}