CanvasRenderingContext2D: getContextAttributes() メソッド

構文

getContextAttributes()

引数

なし。

返値

実際のコンテキスト引数が含まれている CanvasRenderingContext2DSettings オブジェクト。 次のメンバーを持っています。

alpha 省略可

論理値で、このキャンバスがアルファチャンネルを持っているかどうかを示します。 false の場合、背景は常に不透明になります。これにより、透明なコンテンツや画像が高速に描画される可能性があります。

colorSpace 省略可

レンダリングコンテキストの色空間を示します。使用可能な値は次のとおりです。

• srgb: sRGB 色空間を示します。
• display-p3: display-p3 色空間を示します。

colorType 省略可

レンダリングコンテキストの色タイプを示します。使用可能な値は次のとおりです。

• "unorm8" は色チャンネルを 8 ビットの符号なし値に指定します。これが既定値です。
• "float16" は、色チャンネルを16ビット浮動小数点値で指定することを示します。

desynchronized 省略可

論理値で、ユーザーエージェントがキャンバスの描画サイクルをイベントループから非同期化することでレイテンシーを低減しているかどうかを示します。

willReadFrequently 省略可

論理値で、このキャンバスが、getImageData() を介した頻繁な読み出し操作に対応するために、ハードウェアアクセラレーションではなくソフトウェアアクセラレーションを使用するかどうかを示します。

例

この例は、キャンバスコンテキストを生成する際にコンテキスト属性を指定する方法と、その後で getContextAttributes() を呼び出してブラウザーが実際に使用した引数を取得する方法を示しています。

<pre id="log"></pre>

const logElement = document.getElementById("log");
function log(text) {
  logElement.innerText += text;
}

最初に HTMLCanvasElement.getContext() を使用してコンテキストを作成し、コンテキスト属性を 1 つだけ指定します。

let canvas = document.createElement("canvas");
let ctx = canvas.getContext("2d", { alpha: false });

getContextAttributes() メソッドが対応している場合、それを使用してブラウザーが実際に使用した属性（明示的に指定した属性を含む）を読み戻します。

if (ctx.getContextAttributes) {
  const attributes = ctx.getContextAttributes();
  log(JSON.stringify(attributes));
} else {
  log("CanvasRenderingContext2D.getContextAttributes() に対応していません。");
}

ブラウザーが対応している属性に応じて、ログには {alpha: false, colorSpace: 『srgb』, desynchronized: false, willReadFrequently: false} のような文字列が表示されるはずです。

仕様書

ブラウザーの互換性

関連情報

• HTMLCanvasElement.getContext()
• WebGLRenderingContext.getContextAttributes()