Chapter 84

ランダムディザリング

miku
miku
2021.11.19に更新
このチャプターの目次

実行例


解説

  1. ピクセルから色を取り出し、明るさを計算する。
  2. 明るさ / 明るさの最大値の確率で白、そうでなければ黒の色で対象のピクセルを塗りつぶす。

例えば明るさが 10 で、明るさの最大値が 255 の場合、10/255 で約4%の確率で白、約96%の確率で黒に変換する。つまり、対象ピクセルの明るさが低ければ黒になる確率が高くなり、逆に明るさが高ければ白になる確率が高くなる。

コード例

let img;

function preload() {
  img = loadImage("./0.png");
}

function setup() {
  createCanvas(img.width, img.height);
  img.loadPixels();

  for (let y = 0; y < img.height; y++) {
    for (let x = 0; x < img.width; x++) {
      const pixel = getPixel(x, y);

      const r = red(pixel);
      const g = green(pixel);
      const b = blue(pixel);

      const gray = 0.299 * r + 0.587 * g + 0.114 * b;

      let v = 255;
      if (gray <= random(255)) {
        v = 0;
      }

      setPixel(x, y, [v, v, v]);
    }
  }

  img.updatePixels();
  image(img, 0, 0);
}

function getPixel(x, y) {
  const i = (y * img.width + x) * 4;
  return [
    img.pixels[i],
    img.pixels[i + 1],
    img.pixels[i + 2],
    img.pixels[i + 3],
  ];
}

function setPixel(x, y, pixel) {
  const i = (y * img.width + x) * 4;
  img.pixels[i + 0] = pixel[0];
  img.pixels[i + 1] = pixel[1];
  img.pixels[i + 2] = pixel[2];
}