var canvasDom = document.getElementById("canvas");

// 获取canvas上下文
var context = canvasDom.getContext("2d");
// 画笔的起点
context.moveTo(100,100);
// 画笔画至的点
context.lineTo(700,700);
// 绘制
context.stroke();
// 开始新的图形画起
context.beginPath();
// 封闭图形（与beginPath配对使用）
context.closePath();

/******/
var image = new Image();
image.src = "...";
image.onload = function(){
     // drawImage(image,100,100)指定图片原有的尺寸平铺在画布上
     //context.drawImage(image,100,100);

     // drawImage(image,0,0,canvas.width,canvas.height)使图片铺满画布
     //context.drawImage(image,0,0,canvas.width,canvas.height);

     // drawImage(image,50,50,200,200,300,300,500,500);指定图片中的某部分（50,50,200,200）平铺在画布的某位置上（300,300,500,500）
     context.drawImage(image,50,50,200,200,300,300,500,500);
}