このページでは[「P5.js 日本語リファレンス」] (https://qiita.com/bit0101/items/91818244dc26c767a0fe) の erase関数を説明します。
erase()
説明文
erase() に続くすべての描画はキャンバスから差し引かれます。差し引かれた領域はキャンバスの下のWebページを表示します。erase() は noErase() でキャンセルできます。
image() および background() で行われた描画は erase() の影響を受けません。
構文
erase([strengthFill], [strengthStroke])
パラメタ
-
strengthFill
Number:図形の塗りつぶしの消去の強さを表す数値(0〜255)。引数が指定されていない場合、デフォルト 255 になり完全な強度になります。(オプション) -
strengthStroke
Number:図形のストロークの消去の強さを表す数値(0〜255)。引数が指定されていない場合、デフォルト 255 になり完全な強度になります。(オプション)
例1
function draw() {
background(100,100,250); // 背景を青色に設定
fill(0, 255, 100); // 塗りつぶし色を緑色に設定
rect(20,20,60,60);
erase() ; // 差し引き(くり抜き)を設定
ellipse(25,30,30); // 円で差し引き
noErase() ;
}
実行結果
例2
function setup() {
createCanvas(100,100,WEBGL);
}
function draw() {
background(250, 250, 150); // 背景を青色に設定
fill(15, 195, 185);// 塗りつぶし色を緑色に設定
noStroke() ;
sphere(30);
erase() ; // 差し引き(くり抜き)を設定
rotateY(frameCount * 0.02); // Y軸を中心に回転
translate(0, 0, 40);
torus(15,5); // トーラス(ドーナッツ形状)で差し引き
noErase() ;
}
実行結果
著作権
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) に従います。