Edit in JSFiddle

//Basic canvas drawing - For www.Bluelemoncode.com

var canvas = document.getElementById("myCanvas"); //create canvas object
var context = canvas.getContext("2d");   //get canvas context                                  
/***** Draw line *****/
context.lineWidth = 8; // define line width
context.strokeStyle = "blue"; // define line color
context.moveTo(70, 50); //define x,y position for line starting point
context.lineTo(400, 50); //define x,y for end position
context.stroke(); //draw using defined information    

/***** Draw circle *****/

//reset list of subpaths so that the context once again has zero subpaths
//use arc method to draw circle. The parameters are 
//arc(x, y, radius, startAngle, endAngle, anticlockwise)
context.arc(180, 150, 50, 0, 2 * Math.PI, false);  //remember.. PI in circle formula
context.fillStyle = "blue"; // fill color
context.lineWidth = 2; //define width of circle border
context.strokeStyle = "black"; //define border color
context.stroke();//draw using defined information

/***** Draw Image *****/
//reset path again
var imageObj = new Image(); //create image object
imageObj.src = "http://bluelemoncode.com/Demo/car.jpg"; //assign image source
context.drawImage(imageObj, 70, 250); //draw image using image object at specified position
<canvas id="myCanvas" width="578" height="800">