canvas画布

//创建画布对象
var canvas = document.createElement("canvas");
//返回一个用于在画布上绘图的环境
var ctx = canvas.getContext("2d");
//设置画布宽度
canvas.width = expectWidth;
//设置画布高度
canvas.height = expectHeight;
//向画布上绘画图像
ctx.drawImage(image, 0, 0, expectWidth, expectHeight);
//转换为base64格式的图片（默认为png格式）
base64 = canvas.toDataURL("image/jpeg", 0.8);

---

!!!注意drawImage的写法，其传参值份三种，不同的写法，表示不同的功能，其传参的个数也不一样：

ctx.drawImage(img,x,y);     //在画布上定位图像

ctx.drawImage(img,x,y,width,height);   //在画布上对图像进行定位，然后规定图像的宽度和高度

ctx.drawImage(img,sx,sy,swidth,sheight,x,y,width,height   //剪切图像，并在画布上定位被剪切的部分