图片

drawImage

drawImage(image, dx, dy); drawImage(image, dx, dy, dWidth, dHeight); drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);

其中，dx,dy是canvas画布上的起始x,y坐标，即会从x,y开始绘制图片。不缩放图片。

dWidth, dHeight是在画布上的绘制宽高。会缩放图片到指定的宽高。

sx,sy是目标左上角x和y的坐标

sWidth,sHeight是裁切宽度和高度

let img = new Image();
img.src = '图片路径'

// 绘制图片需要等待图片加载完毕
img.onload = function(){
  // ctx.drawImge(img, 100,100);
  // ctx.drawImage(img, 100,100,100,200);
  ctx.drawImage(img, 100,100,400,400, 100, 100, 400,400)
}