context.drawImage(img,sx,sx,swidth,sheight,x,y,width,height);
img：规定要使用的图像、画布或视频。
sx：可选。开始剪切的 x 坐标位置。
sx：可选。开始剪切的 y 坐标位置。
swidth：可选。被剪切图像的宽度。
sheight：可选。被剪切图像的高度。
x：在画布上放置图像的 x 坐标位置。
y： 在画布上放置图像的 x 坐标位置。
width：可选。要使用的图像的宽度(伸展或缩小图像)。
height：可选。要使用的图像的高度(伸展或缩小图像)。
理解：
1、接收(3、5、9)个参数，其他个数参数会报错，传入参数个数不同，同位数上的参数代表意思不同
接收参数个数(3)：img,x,y
接收参数个数(5)：img,x,y,width,height
接收参数个数(9)：img,sx,sx,swidth,sheight,x,y,width,height
2、参数作用
sx,sx,swidth,sheight：四个参数配合，可以在原图上截取想要显示的部分(类比截图)。当传入参数为5个是，这四个参数不在5个参数中，默认为(0,0,img.naturalWidth,img.naturalHeight)，swidth,sheight允许大于原图的img.naturalWidth,img.naturalHeight，超出部分为空白。
width,height：将截下来的图片按照width,height展示