The CanvasRenderingContext2D.getContextAttributes()
method returns an object that contains attributes used by the context.
Note that context attributes may be requested when creating the context with HTMLCanvasElement.getContext()
, but the attributes that are actually supported and used may differ.
A CanvasRenderingContext2DSettings
object that contains the actual context parameters. It has the following members:
-
alpha
Optional
-
A Boolean indicating if the canvas contains an alpha channel. If false
, the backdrop is always opaque, which can speed up drawing of transparent content and images.
-
colorSpace
Optional
-
Specifies the color space of the rendering context. Possible values are:
-
desynchronized
Optional
-
A Boolean indicating the user agent reduced the latency by desynchronizing the canvas paint cycle from the event loop.
-
willReadFrequently
Optional
-
A Boolean indicating whether or not this canvas uses software acceleration (instead of hardware acceleration) to support frequent read-back operations viagetImageData()
.
This example shows how you can specify context attributes when creating a canvas context, and then call getContextAttributes()
to read back the actual parameters that the browser used.
First we create a context using HTMLCanvasElement.getContext()
, specifying just one context attribute.
let canvas = document.createElement("canvas");
let ctx = canvas.getContext("2d", { alpha: false });
If the getContextAttributes()
method is supported, we use it to read back the actual attributes used by the browser (including those we explicitly specified):
if (ctx.getContextAttributes) {
const attributes = ctx.getContextAttributes();
log(JSON.stringify(attributes));
} else {
log("CanvasRenderingContext2D.getContextAttributes() is not supported");
}
Depending on the attributes supported by the browser, the log below should display a string that looks something like: {alpha: false, colorSpace: 'srgb', desynchronized: false, willReadFrequently: false}