HTMLCanvasElement

HTMLCanvasElement インタフェースは canvas 要素のレイアウトや表現の操作のための属性やメソッドを提供します。HTMLCanvasElementHTMLElementインタフェースのプロパティやメソッドも利用可能です。

属性

HTMLElementから継承する属性の他に以下の属性を持ちます。

HTMLCanvasElement.height (en-US)

正のintegerheight という HTML の<canvas>要素の属性で指定された CSS ピクセルの値です。もしこの属性が指定されていないか、無効な値であるならば、デフォルト値として150を用います。

HTMLCanvasElement.mozOpaque (en-US) Non-standard

Booleanmoz-opaqueという<canvas>要素で指定されたものを反映したものです。この属性は canvas が半透明であることが重要か否かを指定します。もし半透明がないならば、描画を最適化できます。

HTMLCanvasElement.width (en-US)

正のintegerwidth という HTML の<canvas>要素の属性で指定された CSS ピクセルの値です。もしこの属性が指定されていないか、無効な値であるならば、デフォルト値として300を用います。

メソッド

HTMLElementから継承するメソッドの他に以下のメソッドを持ちます。

HTMLCanvasElement.captureStream() Experimental

Returns a CanvasCaptureMediaStream (en-US) that is a real-time video capture of the surface of the canvas.

HTMLCanvasElement.getContext() (en-US)

Canvas の描画コンテキストを返すか、サポートされていないコンテキスト ID の場合 null を返します。 描画コンテキストを用いて Canvas に描画することができます。 getContext の引数に"2d"を渡すとCanvasRenderingContext2D オブジェクトを、"experimental-webgl"(または"webgl")を渡すと WebGLRenderingContextオブジェクトを返します。 "experimental-webgl"または"webgl"コンテキストは、ブラウザが WebGL に対応している場合に限り使用できます。

HTMLCanvasElement.toDataURL()

Returns a data-URL containing a representation of the image in the format specified by the type parameter (defaults to png). The returned image is in a resolution of 96dpi.

HTMLCanvasElement.toBlob()

Creates a Blob object representing the image contained in the canvas; this file may be cached on the disk or stored in memory at the discretion of the user agent.

HTMLCanvasElement.transferControlToOffscreen() (en-US) Experimental

Transfers control to an OffscreenCanvas object, either on the main thread or on a worker.

HTMLCanvasElement.mozGetAsFile() (en-US) Non-standard Deprecated

Returns a File object representing the image contained in the canvas; this file is a memory-based file, with the specified name. If type is not specified, the image type is image/png.

仕様書

Specification
HTML Standard
# htmlcanvaselement

ブラウザーの互換性

BCD tables only load in the browser

関連情報

  • HTML element implementing this interface: <canvas>.