HTML canvas fillText() 方法
定义和用法
fillText()
方法在画布上绘制填色的文本。文本的默认颜色是黑色。
సూచనలు:ఉపయోగించండి font అంశాలను రూపకల్పన చేయడానికి మరియు ఉపయోగించడానికి fillStyle పదబంధాను మరొక రంగు/స్ప్రేడ్ క్రొమ్ తో రెండు రంగుల్లో చూపిస్తారు.
ప్రతిమా స్థానం
fillText() మెథడ్ను ఉపయోగించి, కాన్వాస్ పైన "Hello world!" మరియు "codew3c.com" పదబంధాను వ్రాయండి:
జావాస్క్రిప్ట్:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.font="20px Georgia"; ctx.fillText("Hello World!",10,50); ctx.font="30px Verdana"; // స్ప్రేడ్ క్రొమ్ సృష్టించండి var gradient=ctx.createLinearGradient(0,0,c.width,0); gradient.addColorStop("0","magenta"); gradient.addColorStop("0.5","blue"); gradient.addColorStop("1.0","red"); // 用渐变填色 ctx.fillStyle=gradient; ctx.fillText("codew3c.com",10,90);
语法
context.fillText(text,x,y,maxWidth);
参数值
参数 | 描述 |
---|---|
text | 规定在画布上输出的文本。 |
x | 开始绘制文本的 x 坐标位置(相对于画布)。 |
y | 开始绘制文本的 y 坐标位置(相对于画布)。 |
maxWidth | 可选。允许的最大文本宽度,以像素计。 |
浏览器支持
表中的数字注明了首个完全支持该属性的浏览器版本。
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
注释:Internet Explorer 8 以及更早的版本不支持