01canvas基本使用
<canvas>标签
<canvas width="800" height="600">
您的浏览器不支持Cancas
</canvas>
绘图上下文对象
var canvas = document.getElementById('canvas');
var ctx=canvas.getContext('2d');
02canvas动画与其他操作
绘制圆形或圆弧：arc(x,y,r,sAngle,eAngle,ccw)
绘制曲线：quadraticCurveTo(cx,cy,x,y)
文本处理
常用属性：font属性，textAlign属性
常用方法：fillText(text,x,y,maxWidth),strokeText(text,x,y,maxWidth)
绘制图像
方法：
drawImage(img,x,y) 绘制图像
drawImage(img,x,y,width,height) 指定高度宽度
drawImage(img,sx,sy,swidth,sheight,x,y,width,height) 截取图像一部分
示例：
var img=new Image();
img.src="test.png";
context.drawImage(img,10,20,200,100)
动画处理的时间控制
setInterval()和setTimeout()
requestAnimationFrame()
03音频和视频 IE9+
04综合应用canvas和video
坐标系统操作
translate(x,y) 坐标系统平移
rotate(angle) 坐标系统旋转
canvas状态的保存与恢复
save() 保存当前Canvas状态
restore() 将canvas状态恢复到之前保存的状态
05地理位置服务
Geolocation API简介
作用：用于定位用户的位置 IE9+
关于地理位置信息
1、Geolocation返回的位置信息：十进制格式的经纬度坐标
2、地理位置信息的来源：IP地址、GPS、WIFI、手机ID、自定义位置
Geoloacation 定位请求函数
单次定位请求
重复性位置更新请求
06网页存储
Web Storage API 简介
作用： 用于将数据存储在浏览器中 IE8+
与cookie的区别
cookie容量小，会自动进行网络传输 4k
web storage容量大，不会自动进行网络传输 5M
两种存储方式
localStorage：用于持久化的本地存储
sessionStorage：用于存储一次会话的数据
Web Storage 的数据以”键值对“的方式存储
07构建离线应用一般步骤
1、为<html>元素定义manifest属性值
2、定义manifest文件（放在服务器端）
3、定义相关的JavaScript代码
缓存清单文件（manifest文件）
定义：
1、文件后缀名：.appcache、.manifest等
2、内容：分区块，每行定义一个资源文件名
CACHE MANIFEST - 在此标题下列出的文件将在首次下载后进行缓存
NETWORK - 在此标题下列出的文件需要与服务器的连接，且不会被缓存
FALLBACK - 在此标题下列出的文件规定当页面无法访问时的回退页面（比如 404 页面）
3、注释：#开头的行
applicationCache.status
0 UNCACHED 未缓存
1 IDLE 空闲
2 CHECKING 检查中
3 DOWNLOADING 下载中
4 UPDATEREADY 更新就绪
5 OBSOLETE 过期
applicationCache.update()
作用：请求浏览器更新缓存
注意：1、当manifest文件修改时，才会下载必要的新资源
2、如果没有缓存或者缓存已经过期，则会抛出错误