変数を変更して動く線を作成します。線がウィンドウの端から外れると、変数は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.