context.drawImage(img,x,y) x,y图像起始坐标
context.drawImage(img,x,y,w,h) w,h指定图像的宽度和高度
context.drawImage(img,sx,sy,sw,sh,dx,dy,dw,dh) s被复制区域 d复制后
理解了其实挺简单的！就是不知道用用到多少？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function draw(id){
var canvas = document.getElementById(id);
var context = canvas.getContext("2d");
context.fillStyle = "#EEEEEEf";
context.fillRect(0,0,500,500);
image = new Image();
image.src = "图片地址"；
image.onload = function(){}
}
function drawImage(context,image){
context.drawImage(image,100,100);
context.draeImage(image,270,270,380,380,230,230,240,240);
}
</script>
</head>
<body onload="draw(‘canvas‘)">
<canvas id="canvas" width="500" height="500"></canvas>
</body>
</html>
原文：http://www.cnblogs.com/qiuzhimutou/p/4722879.html