translate

def setup
  background(200)
  translate(30, 20)
  rect(0, 0, 55, 55)
end
def setup
  background(200)
  rect(0, 0, 55, 55)   # Draw rect at original 0,0
  translate(30, 20);
  rect(0, 0, 55, 55)   # Draw rect at new 0,0
  translate(14, 14);
  rect(0, 0, 55, 55)   # Draw rect at new 0,0
end
def draw
  background(200)
  rectMode(CENTER)
  translate(width / 2, height / 2)
  translate(P5Vector.fromAngle(millis / 1000, 40))
  rect(0, 0, 20, 20)
end

p5.jsリファレンス(参考情報)

[p5.js] translate

概要

キャンバス上の座標系を平行移動します。

書式

translate(x, y [, z])
translate(vector)

引数

引数名内容備考オプションデフォルト値
x左右移動単位:ピクセル
y上下移動単位:ピクセル
z前後移動単位:ピクセル
WEBGLモードのキャンバスでのみ有効
0
vector移動量を示すベクトルp5.Vectorオブジェクト

戻値

なし

備考

・座標系変換の効果は累積されていきます。
・ただし、drawメソッドの実行ごとに座標系変換の設定内容がリセットされます。

関連