canvas还提供提供了一些动态方法，使图像可以旋转、缩放和移动，与css3中的方法一样。

  1. 移动：translate(x,y),x和y为横竖方向的偏移量
  2. 旋转：rotate(弧度)，弧度=角度*Math.PI/180；注：多次旋转角度累加。
  3. 缩放：scale(x,y)，x和y为水平和垂直方向的缩放比。

注意：scale缩放有个弊端，那就是即缩放宽高，又缩放边框的宽度，所有在使用时应该注意。

HTML5自学笔记[ 16 ]canvas绘图基础3的更多相关文章

  1. HTML5自学笔记[ 11 ]canvas绘图基础1

    html5新增<canvas>标签用于绘制图像,默认宽高是300*150,canvas的宽高需要在这里设置,在css中设置会有问题:设置的形状,如矩形,会等比缩放,而非设置的宽高. 在不支 ...

  2. HTML5自学笔记[ 17 ]canvas绘图基础4

    绘制图像: drawImage(oImg,x,y),oImg是一个Image对象,(x,y)为绘制起点,绘制的图像大小和源图大小一样. drawImage(oImg,x,y,w,h),后两个参数设置绘 ...

  3. HTML5自学笔记[ 14 ]canvas绘图基础2

    canvas绘制路径不仅可以绘制直线和多边形,还提供了绘制曲线的方法,利用这些方法可以画出多种曲线效果. 方法1:arc(x,y,r,起始弧度,结束弧度,绘制方向);其中(x,y)为圆心坐标,r为半径 ...

  4. HTML5自学笔记[ 23 ]canvas绘图基础7

    变换矩阵: transform(a,b,c,d,e,f),多次使用该函数,效果是多次状态改变的累加: setTransform(a,b,c,d,e,f),会忽略之前的变换,从起始状态开始改变.

  5. HTML5自学笔记[ 15 ]canvas绘图基础6

    关于线条的一些属性: lineCap,这个属性表示的是线条两端的样式,值有butt(默认)/round/square. lineJoin,这个属性表示线条相交的方式,值有miter(默认)/bevel ...

  6. HTML5自学笔记[ 18 ]canvas绘图基础5

    获取图像数据:getImgData(x,y,w,h),返回的是一个ImageData对象,这个对象有三个属性保存图像信息:width/height/data.data是一个数组,保存了每个像素的信息, ...

  7. HTML5自学笔记[ 15 ]canvas绘图实例之钟表

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. HTML5自学笔记[ 13 ]canvas绘图小实例之方块移动

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  9. HTML5自学笔记[ 12 ]canvas绘图小示例之鼠标画线

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. JAVA 实战练习

    1.判断变量是否为奇数偶数. package com.JAVA; import java.util.Scanner; public class text { public static void ma ...

  2. git bash下的选择、复制、粘贴

      1. 打开git bash     2.点击左上角,选择属性,打钩     3.回到界面,选择一行文字,然后点击 “右键”,这样就复制到剪切板了.再点 “右键”,可以粘贴到命令窗口中了.    

  3. 小米盒子连接老式电脑显示器（VGA接口）

    家里闲置一台老式显示器,只有VGA接口,无HDMI高清接口; 小米盒子上有三个输出接口: 一个HDMI高清接口:HDMI接口输出的有音频信号和视频信号,现在买的电视机一般都有HDMI高清接口: 一个A ...

  4. Moq的使用

    参考资料: 1. http://www.codeproject.com/Tips/729646/TDD-using-MOQ 2. https://github.com/Moq/moq4/wiki/Qu ...

  5. .htaccess文件 301重定向URL重写[NC][R][F][L]是什么意思

    .htaccess中的[NC][R][F][L]几个标记是什么意思 NC: no case,就是说不区分大小写 R:redirect,重定向 F:forbidden,禁止访问 L:last,表示已经是 ...

  6. iBATIS sql（XML）中的大于、小于、like等符号写法

    其实就是xml的特殊符号,因为它的配置就是xml,所以可以用下面这种写法转义 <          <     >          >      <>   < ...

  7. iOS - Delegate 代理

    1.Delegate 1.1 协议 协议:是多个类共享的一个方法列表.协议中列出的方法没有相应的实现,计划由其他人来实现.协议中列出的方法,有些是可以选择实现,有些是必须实现. 1>.如果你定义 ...

  8. [转载] Go语言并发之美

    原文: http://qing.blog.sina.com.cn/2294942122/88ca09aa33002ele.html 简介           多核处理器越来越普及,那有没有一种简单的办 ...

  9. css+JS实现遮罩弹框

    <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta nam ...

  10. Fragments

    http://developer.android.com/guide/components/fragments.html#Design Content Design Philosophy Creati ...