如何更改javascript中加载的图像的大小

Question

在这个jsfiddle工作我似乎无法改变图像的高度或宽度。我打算使用不同的图像圈子只是为了简单起见，所以我可以理解发生了什么。

var elem = document.getElementById('myCanvas');
var context = elem.getContext('2d');
    
// Add shadow to canvas
context.shadowOffsetX = 5;
context.shadowOffsetY = 5;
context.shadowBlur = 4;
context.shadowColor = 'rgba(30,30,30, 0.5)';
    
// Load circle image (red)
var img = new Image();
img.onload = function() {
  context.drawImage(img, 0,0);
};
img.src = "http://i.imgur.com/0Kt6H.png";

<canvas id="myCanvas" width="100" height="100">

Answer 1

您需要在函数中添加context.drawImage（）

context.drawImage(img,x,y,width,height);