Latest web development tutorials

méthode toile HTML strokeText ()

HTML Manuel toile de référence HTML Manuel toile de référence

Exemples

Utilisez strokeText (), écrire sur le texte de toile "Bonjour tout le monde!" Et (Avec un gradient) "Grand sourire!":

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

ctx.font="20px Georgia";
ctx.strokeText("Hello World!",10,50);

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.strokeStyle=gradient;
ctx.strokeText("Big smile!",10,90);

Essayez »

support du navigateur

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, la méthode Firefox, Opera, Chrome et Safari soutien strokeText ().

Note: 8 et versions antérieures d'Internet Explorer ne prennent pas en charge l'élément <canvas>.

Remarque: Safari ne supporte pas les paramètres maxWidth.


Définition et utilisation

méthode strokeText () pour dessiner du texte sur une toile (pas de couleur de remplissage). La couleur du texte par défaut est noir.

Astuce: Utilisez la police des attributs pour définir la police et la taille, et utiliser strokeStyle propriété à une autre couleur / gradient pour rendre le texte.

Syntaxe JavaScript: contexte .strokeText (texte, x, y, maxWidth);

Paramètre Valeur

参数 描述
text 规定在画布上输出的文本。
x 开始绘制文本的 x 坐标位置(相对于画布)。
y 开始绘制文本的 y 坐标位置(相对于画布)。
maxWidth 可选。允许的最大文本宽度,以像素计。


HTML Manuel toile de référence HTML Manuel toile de référence