WebGLRenderingContext: unpackColorSpace プロパティ

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

WebGLRenderingContext.unpackColorSpace プロパティは、テクスチャをインポートする際に変換する色空間を指定します。既定値 (srgb) の他に、 display-p3 色空間も使用することができます。

テクスチャ画像のソースとしては、以下のものが利用できます。

テクスチャは WebGLRenderingContext.texImage2D() と WebGLRenderingContext.texSubImage2D() メソッドを使用してインポートされ、インポート中に指定した unpackColorSpace 色空間に変換されます。

これは、 HTMLImageElement において UNPACK_COLORSPACE_CONVERSION_WEBGL 引数が NONE に設定されている場合には適用されないことに注意してください。

値

This property can have the following values:

If an invalid value is specified, then the value of unpackColorSpace will remain unchanged.

例

テクスチャ内の sRGB ImageData を display-p3 に変換

js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");

gl.drawingBufferColorSpace = "display-p3";
gl.unpackColorSpace = "display-p3";

// Some sRGB ImageData
// Will be converted from sRGB to Display P3
const imageData = new ImageData(data, 32, 32);

const tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);
gl.texImage2D(
  gl.TEXTURE_2D,
  0,
  gl.RGBA,
  width,
  height,
  0,
  gl.RGBA,
  gl.UNSIGNED_BYTE,
  imageData,
);

仕様書

Specification
WebGL Specification
# DOM-WebGLRenderingContext-unpackColorSpace

ブラウザーの互換性

BCD tables only load in the browser

関連情報