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

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

updatePixels()

説明文

表示ウィンドウを pixels配列のデータで更新します。 loadPixels() と組み合わせて使用​​します。配列からピクセルを読み取るだけの場合、updatePixels() を呼び出す必要はありません。更新は変更を適用するためにのみ必要です。pixels配列が操作されたとき、または set() が呼び出されたときは常に updatePixels() を呼び出す必要があります。

構文

updatePixels([x], [y], [w], [h])

パラメタ

• x
  Number：更新する領域の左上隅のx座標(オプション)

• y
  Number：更新する領域の左上隅のy座標(オプション)

• w
  Number：更新する領域の幅(オプション)

• h
  Number：更新する領域の高さ(オプション)

例1

let img;
function preload(){
  img = loadImage('assets/mountain.jpg');
}

function setup(){
  createCanvas(300, 200);
  
  image(img, 0, 0, width, height);

  let d = pixelDensity();

  // halfImageのサイズは dが1のとき 4 * (300*1) * (200*1/2) = 120000
  let halfImage = 4 * (width * d) * (height * d / 2);

  // pixels配列にキャンバス上の画像(サイズ:300x200x4)を読み込む
  loadPixels() ;
  
  // 画像の上半分(0～halfImage分)を画像の下半分に設定します
  for (let i = 0; i < halfImage; i++) {
    pixels[i + halfImage] = pixels[i];
  }
  
  // キャンバス上の画像を更新します
  updatePixels() ;
}

実行結果

著作権

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) に従います。