画笔中不但能绘出绘图,还能绘出文档。绘出文档,既能采用充填方式,也能采用描画方式:
fillText(text, x, y,[maxWidth])
strokeText(text, x, y,[maxWidth])
则表示在(x,y)的边线,绘出text的文本。可选模块maxWidth为文档的最小长度,基层单位为画素。假如增设了该特性,当文档文本长度少于该初始值,则会手动按比率增大手写体,使文档的文本全部由此可见;未少于时,则以前述长度表明。假如未增设该特性,当文档文本长度少于画笔长度时,远远超过的文本将被暗藏。
为确保文档在各应用程序下表明完全一致,须要增设文档的式样特性,可增设的特性见表41:
表41文档的式样属性
右图展现了textAlign和textBaseline这三个特性的可能将值,每一文档数组上面的极细是剖面(baseline),小方格记号了绘出文档时的座标(x,y)。
初始化一场fillText()或strokeText()方式,根本无法绘出带队文档,假如要绘出二百一十三文档,须要初始化数次。
context.font =bold 35px Arial;
context.textAlign =center;
context.textBaseline =bottom;
context.fillStyle =#ccc;
context.strokeText(“strokeText”,150,100);
context.fillText(“fillText”,180,140);
font特性定义绘出文档所采用的手写体,其值是一个数组,语法跟CSS的font特性完全一致。上述代码的运行结果如图414所示:
图414绘出文档
跟绘出绘图一样,在对文档进行充填或描边时,除了采用纯色,也能采用渐变或图案。
说明:textAlign特性定义的是x座标点的边线,假设其值为”center”,则x座标点就在文档的中心点的边线,其值为”left”,则x座标点就在文档的最左边的边线。对于从左到右的文档而言,”start”和”left”是等价的,”end”和”right”是等价的;对于从右到左的文档而言,”start”和”right “是等价的,”end”和”left “是等价的。能通过元素的dir特性来增设文档的方向,“rtl”(right-to-left)则表示从右到左,“ltr”( left-to-right)则表示从左到右。
想了解更