Dessine les contours d'un rectangle dans le canvas
Syntaxe myContext.rect(x, y, largeur, hauteur);
Compatible tous navigateurs
Compatible Internet Explorer
Oui
Compatible Edge H駻it?
Oui
Compatible Edge Chromium
Oui
Compatible Chrome
Oui
Compatible Safari
Oui
Compatible Firefox
Oui
Compatible Opera
Oui
Description Dessine les contours d'un rectangle de dimensions largeur et hauteur dans le canvas dont le coin supérieur gauche est en (x, y).
Attention, sans appel à stroke(), rien ne s'affiche.
Exemple 1 : Encadre la zone de texte d'un rectangle
Code source
<canvas id="myCanvas"></canvas>
<script type="text/javascript"> var myCanvas=document.getElementById("myCanvas"); var myContext=myCanvas.getContext("2d");
/* Affichage d'un texte */ var txt="My Big Text";
myContext.font="20px arial";
myContext.fillText(txt, 20,100);
/* Encadrement du texte et recherche des dimensions */ var largeur = parseInt(myContext.measureText(txt).width); var hauteur = 20; var x = 20; var y = 100-hauteur;