在为路径绘图填充颜色或渐变的过程中，我们首先需要用fillStyle设置相关样式属性，并使用以下路径方法：
context.fill()
这看上去很简单，但如果路径绘图存在自我交叉或嵌套，情况会变得很复杂。在这种情况下，需要用到被称为非零(mm-zero)回转数的规则：它根据相关子路径的回转方向决定是否填充。
展示了非零规则的应用。左侧的两个圆都以顺时针方向绘制|而右侧内圆以逆时针方向绘制，从而形成中心的一个洞。
在以一定方向绘制圆的时候，我们根据arc〇函数构造一个辅助函数，将方向作为参数传人，anticlockwise(逆时针〉的有效值为0或1:
varcircle=function(cx.cy,r,anticlockwise){context.moveTo(cx+r,cy);context.arc(cx,cy,r,0,Math.PI*,anticlockwise);}；图6右侧的空心圆形代码如下：
context.beeinPath();context.fillStyle='yellow';circlef900,400,240>0)；circle(900,2);context.fill();context.strokeQ;除了stroke()及fill(),在绘制路径时还会用到context.clip()方法。
顾名思义，clipo用于保证定义的路径图不被画出来，而是用来剪切所有其他绘制元素。位于遮罩中的内容将被显示，其余的则被隐藏。你也可以创建另一个剪切遮罩从而将之前的重置。我们还会谈到更多不错的方法——save()及restore()〇下面一节我们将谈到文本。规范中关于文本的内容仅有四页，是因为Canvas中对文本的支持不够好吗？
第一印象中，Canvas支持可能确实不够好，因为在Canvas中使用文本仅仅局限于设置简单字符串的格式和位置，没有自动换行，没有段落格式，也无法选定已有文本。
规范中只有3个用来决定文本属性的属性，两个绘制文本的方法，以及一个在考虑到当前格式的情况下用来决定文本字符串长度的方法。这看上去并不多，但若仔细观察，我们会发现规范中关于文本的四页都建立在周密的考虑之上。
字体
字体属性的定义使用了CSS规范，其[a-z]o[a-z]text.[a-z]o[a-z]t语法与CCS字体速记符号一致：context.font=[CSSfontproperty]
在此情况下，所有字体选项都可以用一个单字符指定。表列出了所有个体组件以及其可能拥有的值。
在构成font属性时，必须用到的只有font-size(字体大小)及font-family(字体族)，其余都为备选属性，若未注明则其属性值为表中带星号的默认值。鉴于Canvas文本无法识别换行符，属性line-height无效，并被永远忽略。因此，去掉多余项后，font属性的构成可以合并为：
context.font=[
font-stylefont-variantfont-weightfont-sizefont-family关于font-family,与样式表中的字体定义规则相同，你可以定义任意组合的字体族及/或类字体族，浏览器将从列表中优先选择第一个可用字体。
你可以自由地在浏览器或相关平台上选用所需要的Web字体，只要将这些字体通过@font-face嵌入到样式表中，并在font-family中定义好字体名称，它在Canvas中也同样有效：
宁波网站建设认为@font-face{
font-family:Scriptina;
1src:url('fonts/scriptina.ttf');
图7的一些例子展示了CSS有效字体属性及它们在Canvas里的表现形式。之前提到的Web字体Scriptina地址是http://www.fontex.org，那里收集了一些免费字体可供下载。
本文由乐华网络编辑，转载请注明出处
宁波网站建设www.leseo.net
