Hi there! Are you looking for the official Deno documentation? Try docs.deno.com for all your Deno learning needs.

HTMLCanvasElement

Provides properties and methods for manipulating the layout and presentation of elements. The HTMLCanvasElement interface also inherits the properties and methods of the HTMLElement interface.

interface HTMLCanvasElement extends HTMLElement {
height: number;
width: number;
addEventListener<K extends keyof HTMLElementEventMap>(
type: K,
listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any,
options?: boolean | AddEventListenerOptions,
): void;
addEventListener(
type: string,
listener: EventListenerOrEventListenerObject,
options?: boolean | AddEventListenerOptions,
): void;
captureStream(frameRequestRate?: number): MediaStream;
getContext(contextId: "2d", options?: CanvasRenderingContext2DSettings): CanvasRenderingContext2D | null;
getContext(contextId: "bitmaprenderer", options?: ImageBitmapRenderingContextSettings): ImageBitmapRenderingContext | null;
getContext(contextId: "webgl", options?: WebGLContextAttributes): WebGLRenderingContext | null;
getContext(contextId: "webgl2", options?: WebGLContextAttributes): WebGL2RenderingContext | null;
getContext(contextId: string, options?: any): RenderingContext | null;
removeEventListener<K extends keyof HTMLElementEventMap>(
type: K,
listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any,
options?: boolean | EventListenerOptions,
): void;
removeEventListener(
type: string,
listener: EventListenerOrEventListenerObject,
options?: boolean | EventListenerOptions,
): void;
toBlob(
callback: BlobCallback,
type?: string,
quality?: any,
): void;
toDataURL(type?: string, quality?: any): string;
}
var HTMLCanvasElement: {
prototype: HTMLCanvasElement;
new (): HTMLCanvasElement;
};

§Extends

§Properties

§
height: number
[src]

Gets or sets the height of a canvas element on a document.

§
width: number
[src]

Gets or sets the width of a canvas element on a document.

§Methods

§
addEventListener<K extends keyof HTMLElementEventMap>(
type: K,
listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any,
options?: boolean | AddEventListenerOptions,
): void
[src]
§
addEventListener(
type: string,
listener: EventListenerOrEventListenerObject,
options?: boolean | AddEventListenerOptions,
): void
[src]
§
captureStream(frameRequestRate?: number): MediaStream
[src]
§
getContext(contextId: "2d", options?: CanvasRenderingContext2DSettings): CanvasRenderingContext2D | null
[src]

Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas.

@param contextId

The identifier (ID) of the type of canvas to create. Internet Explorer 9 and Internet Explorer 10 support only a 2-D context using canvas.getContext("2d"); IE11 Preview also supports 3-D or WebGL context using canvas.getContext("experimental-webgl");

§
getContext(contextId: "bitmaprenderer", options?: ImageBitmapRenderingContextSettings): ImageBitmapRenderingContext | null
[src]
§
getContext(contextId: "webgl", options?: WebGLContextAttributes): WebGLRenderingContext | null
[src]
§
getContext(contextId: "webgl2", options?: WebGLContextAttributes): WebGL2RenderingContext | null
[src]
§
getContext(contextId: string, options?: any): RenderingContext | null
[src]
§
removeEventListener<K extends keyof HTMLElementEventMap>(
type: K,
listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any,
options?: boolean | EventListenerOptions,
): void
[src]
§
removeEventListener(
type: string,
listener: EventListenerOrEventListenerObject,
options?: boolean | EventListenerOptions,
): void
[src]
§
toBlob(
callback: BlobCallback,
type?: string,
quality?: any,
): void
[src]
§
toDataURL(type?: string, quality?: any): string
[src]

Returns the content of the current canvas as an image that you can use as a source for another canvas or an HTML element.

@param type

The standard MIME type for the image format to return. If you do not specify this parameter, the default value is a PNG format image.