Canvas strokeText() Method

Paglalarawan at Paggamit

strokeText() Ang paraan upang pindutin ang teksto sa kanvas (walang paglalagay ng kulay). Ang kasalukuyang kulay ng teksto ay puti.

Mga Tipan:Gamitin ang font Ang katangian upang tanggapin ang font at laki ng font, at gamitin ang strokeStyle Ang mga katangian ay inilalabas sa ibang kulay/gradient ng teksto.

Mga Halimbawa

Gamitin ang strokeText(), upang isulat ang teksto "Hello world!" at "codew3c.com" sa kanvas:

Ang iyong browser ay hindi sumusuporta sa HTML5 canvas tag.

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";
// Ginawa ang gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Ginamit ang gradient na paglalagay ng kulay
ctx.strokeStyle=gradient;
ctx.strokeText("codew3c.com",10,90);

Subukan ang sarili

Mga Syntax

context.strokeText(text,x,y,maxWidth);

Halaga ng Parameter

Parameter Paglalarawan
text Tinutukoy ang teksto na ipapalabas sa kanvas.
x Ang posisyon ng x-coordinate na magsisimula sa pagpipinta ng teksto (tungkol sa kanvas).
y Ang posisyon ng y-coordinate na magsisimula sa pagpipinta ng teksto (tungkol sa kanvas).
maxWidth Piliin. Ang pinakamataas na lapad ng teksto, na binibilang sa pixels.

浏览器支持

表中的数字注明了首个完全支持该属性的浏览器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

注释:Internet Explorer 8 及其更早版本不支持 <canvas> 元素。