画像データの仕組み

画像データの仕組み

画像データは以下のようなバイトの配列によって形成されています。

1バイトにはそれぞれ一つの色が格納されており、4つの色情報によって1ピクセルが形成されています。(→1ピクセルは4バイト)

R:赤(RED) G:緑(GREEN) B:青(BLUE) A:アルファ

また、配列は左下から右方向に格納され、画像の最右まで到達すると、次の行の最左へと続きます。

※アカデミーの試験で使用しているsharpでは左上から右方向に始まります。

Buffer型について

Buffer型は1byteごとの配列です。

3byte目を参照するためには、

console.log(buffer[3])

4byte目を書き換えるためには

buffer[4] = 255

1byteに格納可能な数値は0〜255です (0x00〜0xff)

例

2ピクセル✕2ピクセルの画像が合った場合、以下のようなデータ配列になります。

1行目の2ピクセル目のBは

buffer[6]

2行目の2ピクセル目のRは

buffer[12]