0）基本结构先写好
- context.strokeStyle = "rgba(0,0,0,.2)"//可以使用css颜色字串（rgb,rgba,hsl,hsla）
- context.fillStyle = "#ff9966"//设置填充颜色//和上面一样
HSLA（e.g:“hsla(0,50%,50%,0)”）是css3中新增的，其中H代表色相（值在0~360之间），S和L分别代表饱和度和亮度（值在0%~100%之间）
2）画线方法
- context.moveTo(x0, y0);//画笔移到x0,y0处
- context.moveTo(x1, y1);//从x0,y0到x1,y1画条线
- context.moveTo(x2, y2);//从x1,y1到x2,y2画条线
- context.fill();//填充形状
- context.stroke();//画线
- context . beginPath() //清空子路径
- context . closePath() //闭合路径
closePath 方法在绘图上下文如果没有子路径时，什么也不做；否则，
它先把最后一个子路径标示为闭合，然后建立一个包含最后子路径的第一个
点的子路径，并加入到绘图上下文。有点拗口，其一般可以看为，假如最后
一个子路径，我们命名为 spN，假设 spN 有多个点，则用直线连接 spN 的最
后一个点和第一个点，然后关闭此路径和 moveTo 到第一个点。
下面利用上面的知识画一个三角形
每个上下文都包含一个绘图状态的堆，绘图状态包含下列内容：
当前的 transformation matrix.
当前的 clipping region
当前的属性值：fillStyle, font, globalAlpha,
globalCompositeOperation, lineCap, lineJoin,
lineWidth, miterLimit, shadowBlur, shadowColor,
shadowOffsetX, shadowOffsetY, strokeStyle, textAlign,
textBaseline
- context . restore() //弹出堆最上面保存的绘图状态
- context.save() //在绘图状态堆上保存当前绘图状态
- context.save() ;
- drawing codes…
- context.restore();
- context.translate(x, y) //移动 Canvas 的原点到x,y处
- context.rotate(angle) //按给定的弧度旋转,按顺时针旋转
下面利用变换画一个正N边型
声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。
