画布drawImage尺寸错误

Question

我使用google闭包实现了一个带有画布的图像编辑器，当我尝试使用canvas从img元素中绘制drawImage时，画布无法显示正确的图像大小，代码如下：

// replace image with canvas
  var $originImage = goog.dom.getElementByClass('testImageClass', $sectionDom);
  var $canvas = goog.dom.getElement('testCanvasId');
  if ($originImage && $canvas) {
    var ctx = $canvas.getContext("2d");
    ctx.drawImage($originImage, 0, 0, $originImage.clientWidth, $originImage.clientHeight);
    goog.dom.classlist.add($originImage, 'display-none');
    goog.dom.classlist.remove($canvas, 'display-none');
  }

显示如下： enter image description here

上部块是原始图像，下部块是画布。 你知道原因吗？提前谢谢！