发表于： 2016-09-08 00:17:54
0 1793
今天完成的事情：初步了解Canvas，学会不规则圆形的画法
明天计划的事情：看Canvas，看项目代码
遇到的问题：
收获：
绘制直线条：
context.moveTo(100,100);//线条起点context.lineTo(70,70);context.lineWidth=5//线条宽度
canvas是基于状态进行绘制的，
线条着色
context.fillStyle='rgb(2,100,30)';//区域着色context.file();
样式
context.strokeStyle='#FF0000'//线条样式context.stroke();//当写了这一代码后，1.2行的代码才生效
将两端绘制分开
context.beginPath()//一段绘制开始//绘制内容context.closePath()//一段绘制结束(注：如果绘制的图形没有封闭那么close会用一条直线自动封闭路径)
绘制弧线线条
语法：
context.arc(
centerx,centery,//圆心xy坐标
radius, //圆半径
startingAngle,endingAngle,//开始弧度值和结束弧度值
anticlockwise=false//可选参数，绘制方向，默认为false顺时针绘制
)
context.lineWidth=5;context.strokeStyle='#005588';context.arc(300,300,200,0,1，Math.PI);//Math.PI相当于半个圆，从右方开始按右下左上方向分别为0,0.5,1,1.5context.stroke();
重绘：
context.clearRect(0,0,1000,1000);
返回列表
评论