drawImage（图片，图片中裁减的起始x坐标，图片中裁减的起始y坐标，裁减区域宽度，裁减区域高度，所画位置x坐标，所画位置y坐标，所画图形宽度，所画图形高度）

首先来看如下效果：

 

代码如下：

var p_w_picpath = new Image();

p_w_picpath.src = "grossini.png";

p_w_picpath.onload = function(){

context.drawImage(p_w_picpath,50,50);

context.drawImage(p_w_picpath,0,0,p_w_picpath.width,p_w_picpath.height / 3,100,50,p_w_picpath.width * 1.5,p_w_picpath.height * 0.5);

context.drawImage(p_w_picpath,0,p_w_picpath.height / 3,p_w_picpath.width,p_w_picpath.height * 2/ 3,180,50,p_w_picpath.width * 1.5,p_w_picpath.height);