fillText(text, x, y [,maxWidth])

绘制文本内容

  ctx.fillText(text, x, y [,maxWidth])

参数

string 要绘画的文本内容

Number 文本左上顶点x坐标

Number 文本左上顶点y坐标

Number 文本最大宽度,如果设定了,当文本超过设定宽度时,会压缩文本


测验

写入一段文本hello world (50,75)

写入一段文本hello world (50,75),宽度为75px.可以看见,对比上图,文字被压缩了,因为超过了75px宽度

打印一段文字,在一个圆的周围.实质上是将这段文字每个字单独打印,每打印一字调整一下坐标点.坐标点是圆上的点,通过计算得来

x = r*cos(A) y = r*sina(A) ,文字对齐采textBaseline用'bottom'方式.另外,文字底部总是指向

圆心的,这个角度计算公式是 "A = - (90度 - 文字坐标点和圆心的连线(半径)与X轴夹角)".

在fillText时,先translate()到计算好的坐标,然后再rotate到这个夹角.最后fillText('',0,0)即可

文字相关方法 strokeText()