沐可的博客 沐可的博客

用canvas标签画直线和三角形

in HTML5 read (125) 文章转载请注明来源!

一、需要用到的方法

context.moveTo(x,y);//绘图的起点,以左上角为坐标原点,水平向右为X轴正方向,竖直向下为Y轴正方向。
context.lineTo(a,b);//绘图终点
context.fillStyle="rgb(23,200,98)";//设置图形填充色
context.fill();//完成填充色的设置
context.lineWith=1;//设置图形边框宽度
context.strokeStyle="#ccc";//设置边框颜色
context.stroke();//完成边框绘制

二、画图

1. 画一条宽为3px,颜色为绿色的直线

2. 画一个填充色为草绿色的无边框三角形

3. 画一条直线和一个有边框的三角形

canvas
最后由沐可修改于2017-09-20 08:18
发表新评论
博客已萌萌哒运行
© 2017 由 Typecho 强力驱动.Theme by Yodu赣ICP备15009801号
PREVIOUS NEXT
雷姆
拉姆