本文主要包含HTML5,绘制图像,canvas等相关知识,佚名 希望在学习及工作中可以帮助到您
初识canvas元素
HTML5新增了一个元素canvas，用于绘图使用，其实它的表现和div比较接近（其实他应该属于inline-block），而提供了许多接口，从而轻易的绘制矩形框、园三角形等
PS：关于HTML5新增元素经过最近两天的学习，和以前对HTML5的认知，我认为HTML5其实还是HTML4，两者之间没多大的区别，无非是增加了点新东西。绘制矩形框
我认为HTML5为我们带来的真正意义是：我们可以用javascript做更多的事情了；我们可以用javascript实现更好的产品了。比如HTML5就解决了我们头疼的跨域问题、实时通信API、与现在的canvas之所以HTML5叫HTML5，我认为他是划时代的，比如他让我们用网页开发游戏变成可能；比如他让电脑桌面只剩IE不在是传说（过于夸张）
直入正题，我们来绘制一个矩形框看看,这里提供一个颜色选择器用于方便的选择颜色，PS：现在不用jquery编程感觉真麻烦。。。
问题：定义样式与定义height与width 一来就遇到了问题，我这里先来截个图：
各位情况canvas元素，图一位设置width与height的情况，图二十用style指定的情况：
可以看到，对于canvas来说，还是老老实实定义高宽的好，别去傻乎乎的用样式了，当然这个问题需要实际研究才能得出最终结论。
好了，现在我们再来看看绘制矩形这个方法：
PS：其实，使用该方法这么麻烦，完全可以将该函数封装下下，使用便会简单许多
1、使用getElementById方法获取绘制对象2、取得上下文getContext('2d')，这都是固定的写法3、指定填充的颜色fillStyle和绘制的颜色strokeStyle，即里面的颜色和边框的颜色4、指定线宽linewidth5、填充/绘制 fillRect/strokeRect 参数为 x,y,width,height6、若是要使其中一块透明，使用clearRect
至此，绘制矩形框便暂时告一段落。
绘制圆形
现在我们来绘制圆形，这个说起绘制圆形，其实我原来用js好像写过一个，这里也贴出来看看：
话说，他还是比较圆的说。。。
进入正题
说起画圆、正弦图等肯定会经过一定计算的，所以稍稍复杂点：
① 创建路径
② 创建图形路径
③ 路径创建完成