base_image = new Image();
base_image.src = 'img/base.png';
base_image.onload = () => ctx.drawImage(base_image, 0, 0);<body>
<canvas id = "my_canvas"></canvas>
<script>
function setup(){
var canvas = document.getElementById('my_canvas');
var ctx = canvas.getContext('2d');
canvas.width = 800;
canvas.height = 600;
var image = new Image();
image.src = 'a.png';
ctx.drawImage(image,5,5);
};
window.onload = setup;
setup();
</script>ctx.drawImage(image, x, y) // top left coords
ctx.drawImage(image, x, y, width, height) // scaledcontext.drawImage(image, point.x, point.y, width, height)/**
* @function drawImage
* @param {HTMLImageElement} image
* @param {Vector} point
* @param {number} width
* @param {number} height
* draw an image on the canvas
* @memberof Shapes
*/
function drawImage(image: HTMLImageElement, point: Vector, width: number, height: number) {
this.context.drawImage(image, point.x, point.y, width, height)
}