《HTML5 Canvas开发详解》——2.3　Canvas状态

本节书摘来自异步社区《HTML5 Canvas开发详解》一书中的第2章，第2.3节,作者： 【美】Steve Fulton , Jeff Fulton 更多章节内容可以访问云栖社区“异步社区”公众号查看。

2.3　Canvas状态

在Canvas上下文中绘图时可以利用所谓的绘图堆栈状态。每个状态随时存储Canvas上下文数据。下面是存储在状态堆栈的数据列表。

变换矩阵信息，例如旋转或平移时使用context.rotate()方法和context.setTransform()方法。当前剪贴区域。画布属性的当前值，如下所示（但不限于）。 —globalAlpha —globalCompositeOperation —strokeStyle —textAlign, textBaseline —lineCap, lineJoin, lineWidth, miterLimit —fillStyle —font —shadowBlur, shadowColor, shadowOffsetX, and shadowOffsetY

本章稍后会讲到这些状态。

2.3.1　什么不属于状态当前路径（本章稍后将探讨）和当前位图（参见第4章）受Canvas上下文控制，不属于保存的状态。这个重要的功能允许在画布上对单个对象进行绘画和制作动画。2.7节“简单画布变换”将初始化Canvas状态，以将变换应用到当前建立和绘制的形状，同时保持画布其他部分不变。

2.3.2　如何保存和恢复Canvas状态保存（推送）当前状态到堆栈，调用以下函数。

context.save()

调出最后存储的堆栈恢复画布，使用以下函数。

context.restore() 相关资源：从入门到精通HTML5——PDF——网盘链接