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 的属性,而非绘
图上下文。

转载于:https://www.cnblogs.com/aimyfly/p/3786149.html

Canvas 属性,方法相关推荐

  1. (四)Canvas API方法和属性汇总

    canvas主要属性和方法 方法 描述 save() 保存当前环境的状态 restore() 返回之前保存过的路径状态和属性 createEvent()   getContext() 返回一个对象,指 ...

  2. TagCanvas文字云属性+方法汇总

    TagCanvas文字云属性+方法汇总 前言 导入 使用 可用属性 js方法 jq方法 前言 甲方爸爸要一个文字旋转的炫酷功能,无意间发现了这个插件,用起来还可以就是感觉扩展性不强,由于网上的资料太少 ...

  3. ES6语法~解构赋值、箭头函数、class类继承及属性方法、map、set、symbol、rest、new.target、 Object.entries......

    2015年6月17日 ECMAScript 6发布正式版本 前面介绍基本语法,  后面为class用法及属性方法.set.symbol.rest等语法. 一.基本语法:  1.         定义变 ...

  4. ASP.NET基础教程-DataTable类对象-属性方法和事件

    DataTable类对象可以表示表格,也可以在DataSet中存储多个DataTable对象. 该对象的属性方法和事件列表如下: 转载于:https://blog.51cto.com/chenxing ...

  5. js如何操作表格(常用属性方法汇总)

    js如何操作表格(常用属性方法汇总) 一.总结 一句话总结: 二.表格相关的属性和方法 1.1 Table 对象集合 cells[] 返回包含表格中所有单元格的一个数组. 语法:tableObject ...

  6. 一个用户实体应该有它自己的实体验证,即一个实体应该有它的属性,方法,扩展属性及验证机制组成...

    一个存储验证信息的公用类: /// <summary>      /// 验证信息实体类      /// </summary>      public class RuleV ...

  7. 静态方法、类方法、属性方法

    静态方法:通过加@staticmethod实现,只是名义上归类管理,实际上在静态方法里访问不了类或实例中的任何属性. class Person(object):@staticmethoddef per ...

  8. python删除类方法_python中向类中动态添加新特性及删除属性方法

    class Foo(object): pass obj = Foo() # 添加对象属性(对象名追加对象属性) obj.a = 100 # print(obj.a) # 添加类属性(类名称追加类属性) ...

  9. 使用proxy来调用未定义的属性方法

    当我们调用一个函数的未定义属性时会报错.那么可以使用一个proxy拦截,并且传入dispatch函数,来使当调用未定义属性时,执行dispatch函数. 原理: 创建一个实例:function cre ...

最新文章

  1. stm32影子寄存器、预装载寄存器,TIM_OC1PreloadConfig和TIM_ARRPreloadConfig的作用
  2. 1.11 神经网络的权重初始化-深度学习第二课《改善深层神经网络》-Stanford吴恩达教授
  3. Python中的time、datetime、calendar模块(时间模块)
  4. window无法对计算机进行,电脑按Win+E快捷键无法打开“计算机”如何解决
  5. C++描述杭电OJ 2018.母牛的故事 ||
  6. apache camel_REST与Apache Camel
  7. mybatis crud_MyBatis教程– CRUD操作和映射关系–第2部分
  8. zabbix解决中文乱码
  9. 设计模式面试题(总结最全面的面试题!!!)
  10. 裸辞两个月,海投一个月,从 Android 转战 Web 前端的求职之路
  11. IC 后端仿真: process corner 和 PVT
  12. vue print 解决针式打印机打印失败不清晰的问题
  13. SIMD——MMX指令的溢出处理
  14. webgis技术在智慧城市综合治理(9+X)网格化社会管理平台(综治平台)的应用研究...
  15. Android -- 传感器使用示例, 用方向传感器做指南针
  16. 隐私计算-多方安全计算
  17. 为什么华为a1路由器网速变慢_多设备上网速度慢? 华为路由 A1 畅享版提速20%...
  18. C语言字符串替换函数(strrpl)
  19. element tree不刷新视图_BIM小技巧001 | Revit如何在平面视图中看见新增的标高?
  20. android 外联wap

热门文章

  1. 模拟二:STEMA 考试选择题模拟练习试卷(中级组) 及答案 + 解题后期更新
  2. Vue 之qs 使用详解
  3. vue使用element日期选择器,选择日期少一天的问题
  4. 写文件 追加_总结Java中创建并写文件的5种方式
  5. 空间刚架matlab_Matlab绘制空间几何图
  6. php实现微信清粉功能,PHP实现微信提现功能
  7. 数据中心支持物联网的5种方式
  8. Java游戏地下城_地下城与勇士DNF-鬼剑士
  9. 成功解决ImportError: cannot import name 'PILLOW_VERSION'
  10. 成功解决D8016“/ZI”和“/Gy-”命令行选项不兼容