HTMLCanvasElement
Baseline
Widely available
*
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
L'interface HTMLCanvasElement fournit des propriétés et des méthodes pour manipuler la disposition et la présentation des éléments HTML <canvas>. L'interface HTMLCanvasElement hérite également des propriétés et des méthodes de l'interface HTMLElement.
Propriétés d'instance
Hérite des propriétés de son parent, HTMLElement.
HTMLCanvasElement.height-
L'attribut HTML
heightde l'élément<canvas>est un entier non négatif reflétant le nombre de pixels logiques (ou valeurs RGBA) descendant d'une colonne du canevas. Lorsque l'attribut n'est pas défini, ou s'il est défini sur une valeur invalide (par exemple une valeur négative), la valeur par défaut150est utilisée. Si aucune hauteur CSS [separate] n'est assignée au<canvas>, cette valeur sera également utilisée comme hauteur du canevas en pixels CSS. HTMLCanvasElement.width-
L'attribut HTML
widthde l'élément<canvas>est un entier non négatif reflétant le nombre de pixels logiques (ou valeurs RGBA) parcourant une rangée du canevas. Lorsque l'attribut n'est pas défini, ou s'il est défini sur une valeur invalide (par exemple une valeur négative), la valeur par défaut300est utilisée. Si aucune largeur CSS [separate] n'est assignée au<canvas>, cette valeur sera également utilisée comme largeur du canevas en pixels CSS. HTMLCanvasElement.mozOpaqueNon standard Obsolète-
Une valeur booléenne reflétant l'attribut HTML
moz-opaquede l'élément<canvas>. Elle indique au canevas si la translucidité sera prise en compte ou non. Si le canevas sait qu'il n'y a pas de translucidité, les performances de rendu peuvent être optimisées. Ceci n'est pris en charge que par les navigateurs basés sur Mozilla ; utilisez plutôt la méthode standardiséecanvas.getContext('2d', { alpha: false }). HTMLCanvasElement.mozPrintCallbackNon standard-
Une
fonctioninitialement nulle. Le contenu Web peut définir cette propriété sur une fonction JavaScript qui sera appelée lorsque le canevas doit être redessiné pendant l'impression de la page. Lors de l'appel, la fonction de rappel reçoit un objet "printState" qui implémente l'interface MozCanvasPrintState (angl.). La fonction de rappel peut obtenir le contexte de dessin depuis l'objet printState et doit ensuite appelerdone()dessus lorsqu'elle a terminé. L'objectif demozPrintCallbackest d'obtenir un rendu à plus haute résolution du canevas, adapté à la résolution de l'imprimante utilisée. Voir cet article de blog (angl.)
Méthodes d'instance
Hérite des méthodes de son parent, HTMLElement.
HTMLCanvasElement.captureStream()-
Retourne un
CanvasCaptureMediaStreamTrackqui est une capture vidéo en temps réel de la surface du canevas. HTMLCanvasElement.getContext()-
Retourne un contexte de dessin sur le canevas, ou
nullsi l'identifiant de contexte n'est pas pris en charge, ou si le canevas a déjà été configuré pour un autre mode de contexte. HTMLCanvasElement.toDataURL()-
Retourne une data-URL contenant une représentation de l'image au format défini par le paramètre
type(par défautpng). L'image retournée est à une résolution de 96 dpi. HTMLCanvasElement.toBlob()-
Crée un objet
Blobreprésentant l'image contenue dans le canevas ; ce fichier peut être mis en cache sur le disque ou stocké en mémoire à la discrétion de l'agent utilisateur. HTMLCanvasElement.transferControlToOffscreen()-
Transfère le contrôle à un objet
OffscreenCanvas, soit sur le thread principal, soit sur un worker.
Évènements
Hérite des évènements de son parent, HTMLElement.
Écoutez ces évènements en utilisant addEventListener() ou en assignant un gestionnaire d'évènement à la propriété oneventname de cette interface.
contextlost-
Déclenché si le navigateur détecte que le contexte
CanvasRenderingContext2Da été perdu. contextrestored-
Déclenché si le navigateur restaure avec succès un contexte
CanvasRenderingContext2D. webglcontextcreationerror-
Déclenché si l'agent utilisateur est incapable de créer un contexte
WebGLRenderingContextouWebGL2RenderingContext. webglcontextlost-
Déclenché si l'agent utilisateur détecte que le tampon de dessin associé à un objet
WebGLRenderingContextouWebGL2RenderingContexta été perdu. webglcontextrestored-
Déclenché si l'agent utilisateur restaure le tampon de dessin pour un objet
WebGLRenderingContextouWebGL2RenderingContext.
Spécifications
| Specification |
|---|
| HTML> # htmlcanvaselement> |
Compatibilité des navigateurs
Voir aussi
- L'élément HTML implémentant cette interface :
<canvas>