context . restore() //弹出堆最上面保存的绘图状态

context . save() //在绘图状态堆上保存当前绘图状态

绘图状态可以看作当前画面应用的所有样式和变形的一个快照。而状态的应用则可以避免绘图代码的过度膨胀。

转换(Transformations)

context . rotate(angle)  //按给定的弧度旋转,按顺时针旋转

context . scale(x, y) //按给定的缩放倍率缩放,1.0,为不变

context . setTransform(m11, m12, m21, m22, dx, dy)//重设当前的转换到

context . transform(m11, m12, m21, m22, dx, dy) //矩阵变换,结果等于当前的变形矩阵乘上

context . translate(x, y) //可以理解为偏移,向 x,y方向偏移指定的量,其用来移动 Canvas 的原点到一个指定的值

合成(Compositing)

context . globalAlpha [ = value ] //0-1.0之间的数据,设定图像的透明度

context . globalCompositeOperation [ = value ] //设定重叠图像的覆盖方式,可以设定为(注,值大小写敏感):

颜色和风格

context . fillStyle [ = value ] //返回填充形状的当前风格,能被设置以用来改变当前的填充风格,其值可以是CSS颜色字串,也可以是CanvasGradient或者 CanvasPattern 对象,非法的值将被忽略。

context . strokeStyle [ = value ] //返回当前描绘形状的风格,能被设置,其值同上。

gradient . addColorStop(offset, color) //在给定偏移的地方增加一个渐变颜色点,偏移量取值范围为 0-1.0 之间,否则产生一个 INDEX_SIZE_ERR的异常,color 为 DOM 字符串,如果不能解析,则抛出一个 SYNTAX_ERR的异常

gradient =  context .  createLinearGradient(x0,  y0, x1, y1) //建立一个线性渐变,如果任何一个参数不是有限值,则抛出一个NOT_SUPPORTED_ERR的异常。

gradient = context . createRadialGradient(x0, y0, r0, x1, y1, r1) //建立一个径向渐变,如果任何一个参数不是有限值,则抛出一个NOT_SUPPORTED_ERR的异常。假如 r0或 r1 为负值,则抛出 INDEX_SIZE_ERR的异常。

pattern = context . createPattern(image, repetition)

本方法用指定的图像和重复方向建立一个画布图案对象,image 参数可为 img,canvas,video 元素中的任一个,如果不满足此条件,则抛出TYPE_MISMATCH_ERR 异常,如果图片编码未知或没有图像数据,则抛出INVALID_STATE_ERR 异常;

第二个参数可以是下列值:

repeat         默认参数,如果为空,则为此参数,表示两个方向重复 
repeat-x      仅水平重复 
repeat-y      仅垂直重复 
no-repeat     不重复

canvas的状态 
每个上下文都包含一个绘图状态的堆,绘图状态包含下列内容: 
$ 当前的 transformation matrix. 
$ 当前的 clipping region 
$ 当前的属性值:fillStyle, font, globalAlpha, 
globalCompositeOperation, lineCap, lineJoin, 
lineWidth, miterLimit, shadowBlur, shadowColor, 
shadowOffsetX, shadowOffsetY, strokeStyle, textAlign, 
textBaseline 
注:当前 path 和当前 bitmap 不是绘图状态的一部分,当前 path 是持久
存在的,仅能被 beginPath()复位,当前 bitmap 是 canvas 的属性,而非绘
图上下文。

Canvas 属性,方法的更多相关文章

  1. flutter自定义View(CustomPainter) 之 canvas的方法总结

    画布canvas 画布是一个矩形区域,我们可以控制其每一像素来绘制我们想要的内容 canvas 拥有多种绘制点.线.路径.矩形.圆形.以及添加图像的方法,结合这些方法我们可以绘制出千变万化的画面. 虽 ...

  2. HTML5 Audio/Video 标签,属性,方法,事件汇总

    HTML5 Audio/Video 标签,属性,方法,事件汇总 (转) 2011-06-28 13:16:48   <audio> 标签属性:src:音乐的URLpreload:预加载au ...

  3. python7 静态方法、类方法、属性方法 ;反射;异常处理

      #-*- coding:utf8 -*- # 静态方法@staticmethod # 静态方法(当eat变成静态方法后,再通过实例调用时就不会自动把实例本身当作一个参数传给self了.) clas ...

  4. Delphi中TStringList类常用属性方法详解

    TStrings是一个抽象类,在实际开发中,是除了基本类型外,应用得最多的. 常规的用法大家都知道,现在来讨论它的一些高级的用法. 先把要讨论的几个属性列出来: 1.CommaText 2.Delim ...

  5. React-Native的基本控件属性方法

    对React-Native的学习,从熟悉基本控件开始. View 属性方法 序号 名称 属性Or方法 类型 说明 1 accessibilityLabel 属性 string   2 accessib ...

  6. 常用元素的属性/方法 attr / val / html /text

    常用元素的属性/方法 得到一个元素的高度, $("#myid").height() 得到一个元素的位置, $("#myid").offset() 返回的是一个o ...

  7. HTML5 canvas translate() 方法

    HTML5 canvas translate() 方法 translate() 方法重新映射画布上的 (0,0) 位置.

  8. List的方法和属性 方法或属性 作用

    List的方法和属性 方法或属性 作用 Capacity 用于获取或设置List可容纳元素的数量.当数量超过容量时,这个值会自动增长.您可以设置这个值以减少容量,也可以调用trin()方法来减少容量以 ...

  9. iOS对UIViewController生命周期和属性方法的解析

    目录[-] iOS对UIViewController生命周期和属性方法的解析 一.引言 二.UIViewController的生命周期 三.从storyBoard加载UIViewController实 ...

随机推荐

  1. Mysql怎样取消错误命令

    1.补上分号. 2.quit 3.由于Mysql中,‘号和"号都是成对出现的,故当错误键入'号或"号时,需要补全另一半才能退出.

  2. 稀疏矩阵存储格式总结+存储效率对比:COO,CSR,DIA,ELL,HYB

    稀疏矩阵是指矩阵中的元素大部分是0的矩阵,事实上,实际问题中大规模矩阵基本上都是稀疏矩阵,很多稀疏度在90%甚至99%以上.因此我们需要有高效的稀疏矩阵存储格式.本文总结几种典型的格式:COO,CSR ...

  3. RobotFramework自动化测试之环境搭建安装教程(一)

    RobotFramework是基于Python语言的工具,所以装RF之前要先安装Python: Python现在有2.7跟3.5两个版本,如果是先装了3.5的话,是装不了2.7的.只有先装2.7的 才 ...

  4. JDK AIO编程

    NIO2.0引入了新的异步通道的概念,并提供了异步文件通道和异步套接字通道的实现.异步通道提供两种方式获取获取操作结果. 通过java.util.concurrent.Future类来表示异步操作的结 ...

  5. css 让内容满屏居中不变形

    .selector { position: fixed; width: 100%; height: 100%; background-image: url(path); background-repe ...

  6. DOM--2 创建可重用的对象

    对象中包含的 分类(内置对象: 注意这些都是function:除了Function对象,实例都是object) Function对象 Function实例function 构造函数的function ...

  7. EntityFramework Code First 手写代码实现生成数据库

    第一步:写实体类 第二步:写一个实体操作类,此类必须继承Dbcontext,此处的属性,将会在初始化时(第一次作,增,删,改的时候),生成相应的表. 第三步:运行程序,会自动建表 注意: 若实体类发生 ...

  8. CSS 样式使用

    [attribute] 用于选取带有指定属性的元素. [attribute=value] 用于选取带有指定属性和值的元素. [attribute~=value] 用于选取属性值中包含指定词汇的元素. ...

  9. Python小例子(判断质数)

    只能被自己或者1整除的数为质数 num = int(input('请输入一个数:')) if num > 1: # 查看因子 for i in range(2, num): if (num % ...

  10. 使用dSYM分析App崩溃日志

    前言 我们在开发App过程中,因为连接到控制台,所以遇到问题会很容易找到问题代码.但是对于线上的App出现Crash的时候,我们不可能通过这种方式,也不现实,所以我们只能通过收集Crash信息,来解决 ...