html5学习笔记6-- canvas - tuohaibei_H5之家 - 中国HTML5教程资源分享第一站

绘制普通直线,先看效果图:

实现代码如下:

drawGraph(id) { document.getElementById(id); ); context.fillStyle context.fillRect()//最外层canvas区域 context.beginPath() context.fillStyle context.strokeStyle) { dig) dig) context.lineTo(dxs) } context.closePath()//关闭路径 context.fill()//填充颜色 context.stroke() }

绘制贝塞尔曲线

效果图如下：

代码如下：

drawGraph(id) { document.getElementById(id); ); context.fillStyle context.fillRect() context.beginPath() context.fillStyle context.strokeStyle context.moveTo(dx,dy) ) { dig) dig) context.bezierCurveTo(dxs)//贝塞尔绘制函数 } context.closePath() context.fill() context.stroke() }

关于了解的html5的基本知识点就到这里了，毕竟项目中没有去使用，出于个人闲来无事有个大体了解.并且都很基本，其实这些基本的知识点感觉没必要花费这么多精力去关注，这个时间个人感觉花的太多，完全可以找个小demo去研究，这样驱动的去学习效果会更好，先到这里了，准备投入到下一阶段其他开发知识点的学习中.