画像のモザイク処理

https://gyazo.com/7b6ebcbca1ebbbce79c8c5556e3ea2a7

モザイク処理は想像以上に単純で、一定間隔で取得したピクセルの色で塗りつぶしていくだけで再現できる。

code:javascript

const step = slider.value();

for (let y = 0; y < HEIGHT; y += step) {

for (let x = 0; x < WIDTH; x += step) {

const colorValue = imageData.get(x, y);

fill(colorValue);

rect(x, y, step, step);

}

}