Linear / 直線運動

変数を変更して動く線を作成します。線がウィンドウの端から外れると、変数は0に設定され、線は画面の下に戻ります。

movement variable conditional
Motion Drawing

View Source Code

/*
 * @name Linear
 * @arialabel Horizontal white line on a black background traveling from the bottom to the top of the screen parallel to the x axis
 * @frame 720,400
 * @description Changing a variable to create a moving line.
 * When the line moves off the edge of the window,
 * the variable is set to 0, which places the line back at the bottom of the screen.
 */

let a;

function setup() {
  // createCanvas(720, 400);
  createCanvas(windowWidth, windowHeight);
  stroke(255);
  a = height / 2;
}

function draw() {
  background(51);
  line(0, a, width, a);
  a = a - 0.5;
  if (a < 0) {
    a = height;
  }
}

License

Source code is available on GitHub p5.js website legacy.

All examples are licensed under CC BY-NC-SA 4.0.