This is the simple code for adding an image to a HTML5 canvas using Kinetic Js.

function DrawImage() {
        var stage = new Kinetic.Stage({
            container: 'container',
            width: 800,
            height: 600
        });//Declare the stage for canvas
        layer = new Kinetic.Layer();   
        var imageObj = new Image();
        imageObj.onload = function () {
            var canvasImage= new Kinetic.Image({
                x: 0,
                y: 0,
                image: imageObj
            });        
            layer.draw();
            // add the shape to the layer
            layer.add(canvasImage);

            // add the layer to the stage
            stage.add(layer);
        };       
        imageObj.src = 'Your Image Path';
    }

Steps for the same are as follows

1. Declare a stage Declare a layer
2. Declare an image
3. Add Kinetic image for on load of image declared in 3rd
4. Draw Layer.
5. Step Add kinetic image to Layer
6. Add layer To Stage Assign path of your image to Image object.