pixels

キャンバス上の各ピクセルの色を含む配列。

色は赤、緑、青、アルファ(RGBA)の値を表す数値として格納されます。 pixelsはパフォーマンス上の理由から一次元配列です。

各ピクセルはpixels配列の4つの要素を占め、それぞれRGBA値を 表します。例えば、座標(0, 0)のピクセルはそのRGBA値を pixels[0]pixels[1]pixels[2]pixels[3]に それぞれ格納します。次の座標(1, 0)のピクセルはそのRGBA値をpixels[4]pixels[5]pixels[6]pixels[7]に格納します。 このように続きます。100×100のキャンバスのpixels配列は 100 × 100 × 4 = 40,000個の要素を持ちます。

一部のディスプレイでは、1つの点の色を設定するために複数の小さなピクセルを 使用します。pixelDensity()関数は キャンバスのピクセル密度を返します。高密度ディスプレイでは多くの場合、 pixelDensity()は2を返します。 そのようなディスプレイでは、100×100のキャンバスのpixels配列は 200 × 200 × 4 = 160,000個の要素を持ちます。

キャンバス上の点のRGBA値にアクセスするには、以下に示すように少し計算が 必要です。pixels配列にアクセスする前に loadPixels()関数を呼び出す必要があります。 変更を加えた後はupdatePixels()関数を 呼び出す必要があります。

実例

Notice any errors or typos? Please let us know. Please feel free to edit src/image/pixels.js and open a pull request!

関連するリファレンス