07-15日份学习（js---canvas画布的使用）

canvas

<canvas> 是 HTML5 新增的，一个可以使用脚本(通常为 JavaScript) 在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画，甚至可以进行实时视频处理和渲染。

1.canvas标签

使用canvas需要在页面中添加canvas标签

<canvas id="canvas" width="500" height="500">您的浏览器版本太低，
不支持画布，请更新浏览器
</canvas>

• canvas 默认 宽：300 ， 高 ：150 。
• 最好在标签里显示修改宽高，在CSS表中修改如果比例与默认值不同可能会使绘制的图扭曲
• 结束标签不可省略

2.获取渲染上下文

在创建好的画布上，创建固定大小的上下文对象

通过canvas节点的getContext方法来获取渲染上下文

//1.获取一个画布（要创建一个画布对象）
        var canvas = document.getElementById("canvas");
//2.创建一个画布上下文对象
        var context = canvas.getContex