# OffscreenCanvas >![](../../public_sys-resources/icon-note.gif) **NOTE:** >The APIs of this module are supported since API version 7. Defines a canvas object that can be rendered off the screen. ## Attributes

Name

Type

Description

width

number

Width of the offscreen canvas object.

height

number

Height of the offscreen canvas object.

## Methods

Name

Parameter

Description

getContext

contextId: "2d", options?: CanvasRenderingContext2DSettings

The invoking methods are as follows:

var ctx = canvas.getContext(contextId);

var ctx = canvas.getContext(contextId, options);

The contextId parameter is mandatory. Currently, only the value 2d is supported. The options parameter is optional and is not supported currently.

Obtains the context for drawing on an offscreen canvas. The parameter can be set only to 2d. The return value is a 2D drawing object that provides specific 2D drawing operations. For details, see OffscreenCanvasRenderingContext2D.

toDataURL

type?: string, quality?: number

Generates a URL containing image display information.

  • type: specifies the image format. This parameter is optional. The default value is image/png.
  • quality: specifies the image quality, which ranges from 0 to 1 when the image format is image/jpeg or image/webp. If the value of this parameter exceeds the value range, the default value 0.92 will be used.

transferToImageBitmap

None

Creates an ImageBitmap object from the most recent image rendered by Offscreen Canvas.

## Example ``` var canvas = this.$refs.canvasId.getContext('2d'); var offscreen = new OffscreenCanvas(500,500); var offscreenCanvasCtx = offscreen.getContext("2d"); // ... some drawing for the canvas using the offscreenCanvasCtx ... var dataURL = offscreen.toDataURL(); console.log(dataURL); //data:image/png;base64,xxxxxx var bitmap = offscreen.transferToImageBitmap(); canvas.transferFromImageBitmap(bitmap); ```