P5.js 日本語リファレンス(scale)

このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の scale関数を説明します。

scale()

説明文

頂点を拡大および縮小することにより、形状のサイズを拡大または縮小します。オブジェクトは常に相対的な原点から座標系にスケーリングされます。スケール値は10進数のパーセンテージとして指定されます。たとえば関数呼び出し scale(2.0) は図形の次元を200％増やします。

変換は関数の呼び出しの後に発生するすべてのものに適用され、効果が乗算されます。たとえば scale(2.0) を呼び出してから scale(1.5) を呼び出すことは scale(3.0)と同じです。 scale() がdraw() 内で呼び出された場合、ループが再び始まると変換がリセットされます。

WEBGLモードでのみ z パラメータを使用することができます。この関数は push() および pop() でさらに制御できます。

構文

scale(s, [y], [z])

scale(scales)

パラメタ

• s
  Number | p5.Vector | Number[]：オブジェクトをスケーリングするためのパーセント、または複数の引数が与えられた場合にx軸でオブジェクトをスケーリングするためのパーセント

• y
  Number：y軸でオブジェクトをスケーリングするパーセント(オプション)

• z
  Number：z軸でオブジェクトをスケーリングするパーセント(webglのみ)(オプション)

• scales
  p5.Vector | Number []：オブジェクトをスケーリングするための軸ごとのパーセント

例1

function setup() {
    createCanvas(200, 200);
  }
  
  function draw() {
    background(220);
  
    stroke("red");
    rect(20, 20, 50, 50);
  
    scale(1.5, 1.5);
    stroke("blue");
    rect(20, 20, 50, 50);
  }

実行結果

著作権

p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson.

ライセンス

Creative Commons(CC BY-NC-SA 4.0) に従います。