1var image = new Image(),
2 canvas = document.getElementById('canvas'),
3 ctx = canvas.getContext('2d');
4
5image.src = 'https://i.stack.imgur.com/I4jXc.png';
6
7image.onload = function(){
8 ctx.drawImage(image,
9 70, 20, // Start at 70/20 pixels from the left and the top of the image (crop),
10 50, 50, // "Get" a `50 * 50` (w * h) area from the source image (crop),
11 0, 0, // Place the result at 0, 0 in the canvas,
12 100, 100); // With as width / height: 100 * 100 (scale)
13}