canvas即一个H5的新标签，通过js来实现绘图的神奇功能。
注意，在这里我直接在行间设置了宽高，是因为若不设定宽高，浏览器会默认设置canvas大小为宽300、高100像素，而且不能使用css来设置（会被拉伸），建议直接写于canvas标签内部，或者是直接用js脚本中来设置。如下：
首先，获取canvas的绘图环境，这是一个封装了很多绘图功能的对象，直接翻译成‘上下文’.
var context =canvas.getContext("2d");
写个小例子1
我们使用了几个绘图方法：
1.moveTo(x坐标 , y坐标) 可以理解为定位画笔在画布上的位置
2.lineTo(x坐标 , y坐标) 顾名思义，就是画一条直线到某个点，此方法只做路径运动，并没有视觉上的效果。
3.stroke() 描边方法 让运动路径从视觉上显现 用 画笔描出来
4.strokeStyle 设定颜色的方法 可以直接用颜色名称，例如"red" "green",或者用十六进制颜色"#fff",还有rgb(1-255,1-255,1-255)， rgba(1-255,1-255,1-255,透明度)。
小例子2 写两个不一样颜色的线 代码如下：
关于路径beginPath和closePath
1、系统默认在绘制第一个路径的开始点为beginPath
*2、如果画完前面的路径没有重新指定beginPath，那么画第其他路径的时候会将前面最近指定的beginPath后的全部路径重新绘制
ps：记住每次画路径都在前后加context.beginPath() 和context.closePath()
小例子3 绘制矩形 代码如下：
绘制矩形的两个小方法
1 context.fillRect(x,y,width,height) 所谓的满矩形就是填充一个矩形
2 strokeRect(x,y,width,height) 绘制矩形（不填色）。笔触的默认颜色是黑色。
相反 清除矩形区域即为
context.fillRect(x,y,width,height) strokeRect(x,y,width,height)
canvas基础，未完待续。。。。 どうぞよろしくおねがいします。