canvas-context

Create a RenderingContext (2d, webgl, webgl2, bitmaprenderer, webgpu), optionally offscreen for possible use in a Worker.

See the example and its source with a Worker implementation.

Installation

npm install canvas-context

Usage

import createCanvasContext from "canvas-context";

const { context, canvas } = createCanvasContext("2d", {
  width: 100,
  height: 100,
  offscreen: true,
});

API

Modules

createCanvasContext

Typedefs

ContextType : "2d" | "webgl" | "experimental-webgl" | "webgl2" | "webgl2-compute" | "bitmaprenderer" | "gpupresent" | "webgpu"

A DOMString containing the context identifier defining the drawing context associated to the canvas.

CanvasContextOptions : Object

Options for canvas creation. All optional.

CanvasContextReturnValue : Object

createCanvasContext

createCanvasContext([contextType], [options]) ⇒ CanvasContextReturnValue ⏏

Create a RenderingContext (2d, webgl, webgl2, bitmaprenderer, webgpu), optionally offscreen for possible use in a Worker.

Kind: Exported function

Param	Type	Default
[contextType]	ContextType	"2d"
[options]	CanvasContextOptions	{}

ContextType : "2d" | "webgl" | "experimental-webgl" | "webgl2" | "webgl2-compute" | "bitmaprenderer" | "gpupresent" | "webgpu"

A DOMString containing the context identifier defining the drawing context associated to the canvas.

Kind: global typedef

CanvasContextOptions : Object

Options for canvas creation. All optional.

Kind: global typedef Properties

Name	Type	Default	Description
[width]	number	300	Request an initial canvas width.
[height]	number	150	Request an initial canvas height.
[offscreen]	boolean	false	Request an offscreen canvas.
[worker]	boolean	false	Handle use in a worker.
[contextAttributes]	CanvasRenderingContext2DSettings | WebGLContextAttributes	{}	Attributes to be passed to getContext.

CanvasContextReturnValue : Object

Kind: global typedef Properties

Name	Type
canvas	HTMLCanvasElement | OffscreenCanvas
context	RenderingContext

License

MIT. See license file.