【p5.js】四角形を描画する

rect関数でCanvasに四角形を描画する。

let board_w, board_h, space_w, space_h;

function setup() {
  createCanvas(640, 480);
  board_w = 450;
  board_h = 450;
  space_w = (width-board_h)/2;
  space_h = (height-board_h)/2;
}

function draw() {
  background("black");
  noFill();
  stroke("white");
  rect(space_w, space_h, board_w, board_h);
}

今回は、以下のように出力される。

p5.js Web Editor

A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators,...

editor.p5js.org

参考

reference | p5.js

p5.js a JS client-side library for creating graphic and interactive experiences, based on the core principles of Process...

p5js.org