canvas部分基础知识

基本模板

if(canvas.getContext){
	var context = canvas.getContext("2d");
	context.save;
		//写关于样式的设置的代码
	context.beginPath();
	    //写关于路径的代码
	context.restore();
}

###1.路径容器
每次调用路径api时，都会往路径容器里做登记调用beginPath时，清空整个路径

###2.样式容器
每次调用样式api时,都会往样式容器里做登记
调用save时候,将样式容器里的状态压入样式栈
调用restor时候，将样式栈的栈顶状态弹出到样式样式容器里，进行覆盖

###3.样式栈
调用save时候，将样式容器里的状态压入样式栈
调用restor时候，将样式栈的栈顶状态弹出到样式样式容器里，进行覆盖

canvas的宽高—— cnv.width , cnv.heigth

1. 文本居中的时候有时候需要计算canvas的宽度和高度
2. 在画完图需要清屏的时候也有用处

var cnv = $$("canvas");
var cxt = cnv.getContext("2d");
cxt.clearRect(0, 0, cnv.width, cnv.height);

canvas保存图像

事实上，很多浏览器的canvas的图片保存的方法都是右键—>图片另存为，但是，有些旧版本的浏览器没有这个功能，要是为了兼容，可以加这个。另外这个办法也可以将图片发送到服务器的数据库。

保存图片代码

window.location = cnv.toDataURL("image/png");

canvas的透明度

context.globalAlpha = 1.0;默认值是1.0，取值范围是0.0（透明）~1.0（不透）
这个透明度是对整个画布起作用，要是要对画布中的图片进行透敏度处理，用rgba颜色值。具体另一篇HTML5canvas给图片加滤镜
开头的代码有。