JavaScript画布drawImage无法正常工作

我试图画一个图像的一部分，但它不能正常工作。 当我试着使用它时，它的宽度和高度与原来的不一样

这是我的密码

window.onload=function（）{
ImageObjSketch=新图像（）；//URL
ImageObjSketch.src='1〕https://i.imgur.com/75lATF9.png';
canvasClone=document.getElementById（“squareTarget”）；
ctxClone=canvasClone.getContext（“2d”）；
ctxClone.drawImage（ImageObjSketch，34119,16,16,0,0,38,38）；
}

#squareTarget{
宽度：38px；高度：38px；
位置：相对位置；
右：0px；
显示：内联块；
边框：1px#000000实心；
}

---

您需要明确指定画布的大小。 然后您可以获得二维上下文：

window.onload = function() {
var ImageObjSketch = new Image(); // URL
ImageObjSketch.src = 'https://i.imgur.com/75lATF9.png';

var canvasClone = document.getElementById("squareTarget");
  canvasClone.width = 38;
  canvasClone.height = 38;
  ctxClone = canvasClone.getContext("2d");


ctxClone.drawImage(ImageObjSketch, 34,119,16,16,0,0,38,38);
}

然后您的大小是38，但是您应该使用文档的高度和宽度，但这是一个重构

比如：

ctxClone.drawImage(ImageObjSketch, 34,119,16,16,0,0,canvasClone.width,canvasClone.height);

---

您没有包含代码。指向codepen.io的链接必须附带代码。请使用代码工具栏按钮或CTRL+K键盘快捷键将所有代码缩进4个空格。-在发布之前，它会向你尖叫…@Veluria&Pogrindis我刚刚修复了它。@Pogrindis我检查了它，但它没有修复我的问题。所以我假设问题发生在我身上，因为画布没有宽度和高度属性？另一个问题，为什么代码需要第二次刷新？我的意思是，在刷新页面之前，它不会在第一次运行时显示图像。不确定，可能会使用不同的事件

document.addEventListener（'DOMContentLoaded'，function（）{//your code here}，false）