HTMLCanvasElement

Das HTMLCanvasElement interface bietet Eigenschaften und Methoden zum Manipulieren des Layouts und der Darstellung des <canvas>-Elements. Das HTMLCanvasElement interface erbt au├čerdem Eigenschaften und Methoden des HTMLElement interface.

Eigenschaften

Erbt Eigenschaften von seinem Elternelement, HTMLElement.

HTMLCanvasElement.height
Ein positiver integer, der das height HTML-Attribut des <canvas> Elements in CSS-Pixeln repr├Ąsentiert. Wenn nicht definiert oder wenn es auf einen nicht erlaubten Wert (z.B. einen negativen Wert) gesetzt wird, wird der Standardwert 150 verwendet.
HTMLCanvasElement.mozOpaque This API has not been standardized.
Ein Boolean, der das moz-opaque HTML-Attribut des <canvas> Elements repr├Ąsentiert. Es sagt dem canvas, ob auf Transparenz verzichtet werden soll. Falls true, kann das Zeichnen auf dem canvas beschleunigt werden.
HTMLCanvasElement.width
Ein positiver integer, der das width HTML-Attribut des <canvas> Elements in CSS-Pixeln anzeigt. Wenn nicht definiert oder wenn es auf einen nicht erlaubten Wert (z.B. einen negativen Wert) gesetzt wird, wird der Standardwert 300 verwendet.

Methoden

Erbt Eigenschaften von seinem Elternelement, HTMLElement.

HTMLCanvasElement.captureStream() This is an experimental API that should not be used in production code.
Gibt ein CanvasCaptureMediaStream zur├╝ck, dieses ist ein Echtzeit-Video der Oberfl├Ąche des canvas.
HTMLCanvasElement.getContext()
Gibt einen context des canvas zur├╝ck oder null, falls die context-ID nicht unterst├╝tzt wird. Ein context erm├Âglicht es, auf dem canvas zu zeichnen. Der Aufruf dieser Methode mit "2d" gibt ein CanvasRenderingContext2D Objekt zur├╝ck, w├Ąhrend er mit "experimental-webgl" oder "webgl" ein WebGLRenderingContext Objekt zur├╝ckgibt. Dieser context ist nur bei Browsern m├Âglich, die WebGL unterst├╝tzen.
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() This is an experimental API that should not be used in production code.
Transfers control to an OffscreenCanvas object, either on the main thread or on a worker.
HTMLCanvasElement.mozGetAsFile() This API has not been standardized. This deprecated API should no longer be used, but will probably still work.
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.

Spezifikationen

Spezifikation Status Kommentar
Media Capture from DOM Elements
Die Definition von 'HTMLCanvasElement' in dieser Spezifikation.
Arbeitsentwurf Adds the method captureStream().
HTML Living Standard
Die Definition von 'HTMLCanvasElement' in dieser Spezifikation.
Lebender Standard The method getContext() now returns a RenderingContext rather than an opaque object.
The methods probablySupportsContext(), setContext() and transferControlToProxy()have been added.
HTML 5.1
Die Definition von 'HTMLCanvasElement' in dieser Spezifikation.
Empfehlung  
HTML5
Die Definition von 'HTMLCanvasElement' in dieser Spezifikation.
Empfehlung Initial definition.

Browserkompatibilit├Ąt

Wir konvertieren die Kompatibilit├Ątsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilit├Ątstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (2D context) 4.0 3.6 (1.9.2) 9.0 9.0 [1] 3.1
toBlob() Nicht unterst├╝tzt (bug 67587) 19 (19) [2] ? ? Nicht unterst├╝tzt (bug 71270)
probablySupportsContext(),
setContext(),
transferControlToProxy() This is an experimental API that should not be used in production code.
Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
mozGetAsFile() This API has not been standardized. This deprecated API should no longer be used, but will probably still work. Nicht unterst├╝tzt 4.0 (2) Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
captureStream() This is an experimental API that should not be used in production code. Nicht unterst├╝tzt 41 (41) Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
transferControlToOffscreen() This is an experimental API that should not be used in production code. Nicht unterst├╝tzt 44 (44) [3] Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (2D context) 2.1 (Ja) (Ja) ? 10.0 [1] 3.2
webgl context ? ? (Ja) as experimental-webgl ? ? ?
toBlob() Nicht unterst├╝tzt (bug 67587) Nicht unterst├╝tzt (bug 67587) 18.0 (18) [2] ? ? Nicht unterst├╝tzt (bug 71270)
probablySupportsContext(),
setContext(),
transferControlToProxy() This is an experimental API that should not be used in production code.
Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
mozGetAsFile() This API has not been standardized. This deprecated API should no longer be used, but will probably still work. Nicht unterst├╝tzt Nicht unterst├╝tzt 4.0 (2) Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
captureStream() This is an experimental API that should not be used in production code. Nicht unterst├╝tzt Nicht unterst├╝tzt 41.0 (41) Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt
transferControlToOffscreen() This is an experimental API that should not be used in production code. Nicht unterst├╝tzt Nicht unterst├╝tzt 44.0 (44) [3] Nicht unterst├╝tzt Nicht unterst├╝tzt Nicht unterst├╝tzt

[1] Opera Mini 5.0 and later has partial support.

[2] Support for the third parameter, has been added in Gecko 25 only: when used with the "image/jpeg" type, this argument specifies the image quality.

[3] This feature is behind a feature preference setting. In about:config, set gfx.offscreencanvas.enabled to true.

Siehe auch

  • HTML element implementing this interface: <canvas>.