HTMLCanvasElement
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
* Some parts of this feature may have varying levels of support.
Die HTMLCanvasElement
Schnittstelle bietet Eigenschaften und Methoden zur Manipulation des Layouts und der Darstellung von <canvas>
-Elementen. Die HTMLCanvasElement
-Schnittstelle erbt außerdem die Eigenschaften und Methoden der HTMLElement
-Schnittstelle.
Instanzeigenschaften
Übernimmt Eigenschaften von ihrem übergeordneten Element, HTMLElement
.
HTMLCanvasElement.height
-
Das
height
HTML-Attribut des<canvas>
-Elements ist eine nicht-negativeinteger
, die die Anzahl der logischen Pixel (oder RGBA-Werte) widerspiegelt, die eine Spalte des Canvas hinuntergehen. Wenn das Attribut nicht angegeben ist oder auf einen ungültigen Wert, wie einen negativen, gesetzt ist, wird der Standardwert150
verwendet. Wenn keine [separate] CSS-Höhe dem<canvas>
zugewiesen wird, wird dieser Wert auch als Höhe des Canvas in der Längeneinheit CSS-Pixel verwendet. HTMLCanvasElement.width
-
Das
width
HTML-Attribut des<canvas>
-Elements ist eine nicht-negativeinteger
, die die Anzahl der logischen Pixel (oder RGBA-Werte) widerspiegelt, die eine Zeile des Canvas überqueren. Wenn das Attribut nicht angegeben ist oder auf einen ungültigen Wert, wie einen negativen, gesetzt ist, wird der Standardwert300
verwendet. Wenn keine [separate] CSS-Breite dem<canvas>
zugewiesen wird, wird dieser Wert auch als Breite des Canvas in der Längeneinheit CSS-Pixel verwendet. HTMLCanvasElement.mozOpaque
Nicht standardisiert Veraltet-
Ein boolescher Wert, der das
moz-opaque
HTML-Attribut des<canvas>
-Elements widerspiegelt. Es lässt das Canvas wissen, ob Transparenz ein Faktor sein wird oder nicht. Wenn das Canvas weiß, dass keine Transparenz vorliegt, kann die Malleistung optimiert werden. Dies wird nur in Mozilla-basierten Browsern unterstützt; verwenden Sie stattdessen den standardisiertencanvas.getContext('2d', { alpha: false })
. HTMLCanvasElement.mozPrintCallback
Nicht standardisiert-
Eine
function
, die anfänglich null ist. Webinhalt kann dies auf eine JavaScript-Funktion setzen, die aufgerufen wird, wenn das Canvas neu gezeichnet werden soll, während die Seite gedruckt wird. Wenn aufgerufen, wird der Callback mit einem "printState"-Objekt übergeben, das die MozCanvasPrintState-Schnittstelle implementiert. Der Callback kann den Kontext vom printState-Objekt zum Zeichnen erhalten und muss dann done() darauf aufrufen, wenn er fertig ist. Der Zweck vonmozPrintCallback
ist es, eine hochauflösende Wiedergabe des Canvas in der Auflösung des verwendeten Druckers zu erhalten. Siehe diesen Blogeintrag.
Instanzmethoden
Übernimmt Methoden von ihrem übergeordneten Element, HTMLElement
.
HTMLCanvasElement.captureStream()
-
Gibt einen
CanvasCaptureMediaStreamTrack
zurück, der eine Echtzeit-Videoaufnahme der Oberfläche des Canvas ist. HTMLCanvasElement.getContext()
-
Gibt einen Zeichenkontext auf dem Canvas zurück oder
null
, wenn der Kontextbezeichner nicht unterstützt wird oder das Canvas bereits auf einen anderen Kontextmodus gesetzt wurde. HTMLCanvasElement.toDataURL()
-
Gibt eine Daten-URL zurück, die eine Darstellung des Bildes im durch den
type
-Parameter angegebenen Format enthält (Standard istpng
). Das zurückgegebene Bild hat eine Auflösung von 96dpi. HTMLCanvasElement.toBlob()
-
Erstellt ein
Blob
-Objekt, das das im Canvas enthaltene Bild darstellt; diese Datei kann nach Ermessen des Benutzeragents auf der Festplatte zwischengespeichert oder im Speicher gespeichert werden. HTMLCanvasElement.transferControlToOffscreen()
-
Überträgt die Kontrolle auf ein
OffscreenCanvas
-Objekt, entweder im Hauptthread oder auf einem Worker.
Ereignisse
Übernimmt Ereignisse von ihrem übergeordneten Element, HTMLElement
.
Diese Ereignisse können mit addEventListener()
überwacht werden oder durch Zuweisen eines Ereignis-Listeners zur oneventname
-Eigenschaft dieser Schnittstelle.
contextlost
-
Wird ausgelöst, wenn der Browser erkennt, dass der
CanvasRenderingContext2D
-Kontext verloren gegangen ist. contextrestored
-
Wird ausgelöst, wenn der Browser erfolgreich einen
CanvasRenderingContext2D
-Kontext wiederherstellt. webglcontextcreationerror
-
Wird ausgelöst, wenn der Benutzeragent nicht in der Lage ist, einen
WebGLRenderingContext
oderWebGL2RenderingContext
-Kontext zu erstellen. webglcontextlost
-
Wird ausgelöst, wenn der Benutzeragent erkennt, dass der Zeichnungspuffer, der einem
WebGLRenderingContext
oderWebGL2RenderingContext
-Objekt zugeordnet ist, verloren gegangen ist. webglcontextrestored
-
Wird ausgelöst, wenn der Benutzeragent den Zeichnungspuffer für ein
WebGLRenderingContext
oderWebGL2RenderingContext
-Objekt wiederherstellt.
Spezifikationen
Specification |
---|
HTML> # htmlcanvaselement> |
Browser-Kompatibilität
Loading…
Siehe auch
- HTML-Element, das diese Schnittstelle implementiert:
<canvas>