canvas标签笔记和绘制基本图形

canvas是html5新增的标签。此标签只是图形容器，必须通过通过JavaScript脚本来进行操作绘制。拥有很强大的绘图功能，canvas标签的起始坐标点是在左上方，默认情况下，<canvas>没有边框和内容。

一：基础部分

1.首先先创建一个canvas标签

<canvas id="myCanvas">您的浏览器不支持canvas标签，请更换或升级浏览器</canvas>

因为canvas标签是HTML5新增的标签，低级浏览器存在不支持的情况，建议在标签里面加入“不支持此标签”类似的文字，提醒用户更新浏览器。

2.js获取canvas标签

var myCanvas = document.getElement("myCanvas"); //获取canvas标签，和普通的获取DOM的方式一样的操作

3.定义画笔（也可以理解为获取绘图的命令）

var ctx = myCanvas.getContext("2d"); //这个是二维的，getContext("2d") 对象是内建的 HTML5 对象，拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。

4.定义canvas标签宽高（width和height属性更改）

<canvas id="myCanvas" width="800" height="500">您的浏览器不支持canvas标签ÿ