如何使用canvas绘图
这里是修真院前端小课堂,每篇分享文从
【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】
八个方面深度解析前端知识/技能,本篇分享的是:
【如何使用canvas绘图】
1.背景介绍
Canvas是HTML5新增的组件,它就像一块幕布,可以用JavaScript在上面绘制各种图表、动画等。
没有Canvas的年代,绘图只能借助Flash插件实现,页面不得不用JavaScript和Flash进行交互。有了Canvas,我们就再也不需要Flash了,直接使用JavaScript完成绘制。
2.知识剖析
2.1 canvas的兼容性
Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 标签。
2.2 canvas的一些基本属性
首先得说下width和height属性了,这是在canvas中必备的属性。
width:画布的高度。和一幅图像一样,这个属性可以指定为一个整数像素值或者是窗口高度的百