Create a RenderingContext (2d, webgl, webgl2, bitmaprenderer, webgpu) for use in PEX.
npm install pex-glimport createRenderingContext, { FALLBACKS } from "pex-gl";
// Creates a webgl context filling the window
const context = createRenderingContext();
// Creates a webgl context from an existing canvas and keeps its size
const context = createRenderingContext({ canvas });
// Creates a webgl context on a new canvas with given width and height
const context = createRenderingContext({ width, height });
// Creates a new canvas of type "webgpu"
const context = createRenderingContext({ type: "webgpu" });
// Creates a new canvas of type "webgl" or fallback to experimental-webgl in case it fails
const context = createRenderingContext({ type: "webgl" });
// Disable fallbacks for "webgl2"
FALLBACKS.webgl2 = [];
// Creates a new canvas of type "webgl2" and return null in case it fails
const context = createRenderingContext({ type: "webgl2" });- PexGLOptions :
object Options for context creation. All optional.
- pex-gl
- .FALLBACKS
- .default([opts]) ⇒
RenderingContext
Context fallbacks map
Kind: static constant of pex-gl
Creates a rendering context.
Kind: static method of pex-gl
| Param | Type | Default |
|---|---|---|
| [opts] | PexGLOptions |
{} |
Options for context creation. All optional.
Kind: global typedef Properties
| Name | Type | Default | Description |
|---|---|---|---|
| [width] | number |
window.innerWidth |
Request an initial canvas width. |
| [height] | number |
window.innerHeight |
Request an initial canvas height. |
| [pixelRatio] | boolean |
1 |
Multiply canvas dimensions with a given ratio. |
| [fullscreen] | boolean |
!opts.width && !opts.height |
Make the canvas fullscreen. |
| [type] | "2d" | "bitmaprenderer" | "webgl" | "webgl2" | "webgpu" |
"webgl" |
A "contextType" for getContext. |
| [element] | HTMLElement |
document.body |
Element to append the canvas to. |
| [...contextAttributes] | CanvasRenderingContext2DSettings | WebGLContextAttributes |
{} |
Attributes to be passed to getContext. |
MIT. See license file.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent