How to display Image in Canvas using JavaScript

<input type="button" onclick="ShowImage()" value="Show Image" />
<canvas id="myCanvas"></canvas>
<img id="myImg" />
<script>
    function ShowImage() {
        var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");
        var img = new Image();
        img.onload = function () {
            context.drawImage(img, 10, 10);
        };
        img.src = "https://www.aspsnippets.com/Demos/SampleImages/lighthouse.jpg";
    };
</script>