zoukankan      html  css  js  c++  java
  • Canvas 属性,方法

     

     

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

  • 相关阅读:
    Oracle系列二 基本的SQL SELECT语句
    Oracle系列一 SQL语句基本概念和学习准备
    Android 动态更换桌面图标
    Linux_CentOS下搭建Nodejs 生产环境-以及nodejs进程管理器pm2的使用
    Linux_CentOS中Mongodb4.x 安装调试、远程管理、配置 mongodb 管理员密码
    Linux_CentOS 中systemctl 管理服务、防火墙 firewalld 以及 SELinux 配置
    Linux_CentOS 内存、cpu、进程、端口、硬盘管理
    Linux_CentOS中的MySQL 数据库的安装调试、远程管理
    LInux_CentosOS中yum安装jdk及配置环境变量
    Linux_CentOS软件安装调试 源代码包编译安装和 二进制包配置
  • 原文地址:https://www.cnblogs.com/aimyfly/p/3786149.html
Copyright © 2011-2022 走看看