Canvas绘图环境

canvas绘图环境

元素canvas提供了一张画布，要想在这张画布上面作画，我们需要canvas绘图环境，通过环境我们可以在canvas元素上面绘制图形，文本，显示并修改图像。

var context = canvas.getContext("2d");

context是指向元素canvas的绘图环境对象的引用。

CanvasRenderingContext2D对象包含了大量的绘制图形属性

属性	简介
canvas	指向绘图环境所属的canvas对象
fillstyle	指定该绘图环境在后续的图形填充操作中所使用的颜色，渐变色或方案
font	设定在调用绘图环境对象的fillText()或strokeText()方法时，所使用的字型
globalAlpha	指定全局透明度，取值范围0~1
globalCompsiteOperation	将某个物体绘制在其他的物体之上时采用的绘制方式，取值范围source-atop, source-in, source-out, source-over, destination-top, destination-in, destination-out, destination-over, lighter, copy, xor
lineCap	该值告诉浏览器如何绘制线段的端点，取值范围butt, round, square
lineWidth	线条的宽度
lineJoin	线条绘制交叉的时候的绘制方式，bevel, round, miter
miterLimit	如何绘制miter形式的线段焦点
shadowBlur	延伸的阴影效果，取值为非负的无穷量的double值，该值为高斯模糊方程式中的参数值
shadowColor	阴影的颜色值
shadowOffsetX	阴影效果的水平方向偏移量
shadowOffsetY	阴影效果的垂直方向偏移量
strokeStyle	对路径描边时所使用的绘制风格
textAlign	fillText()或strokeText()方法绘制的时候，所画文本的水平对齐方式
textBaseline	fillText()或strokeText()方法绘制的时候，所画文本的水平对齐方式