Javascript putImageData无法缩放/适应画布中的视频/图像（HTML5、CSS、JS）

我有一个图像，但当我放置尺寸时，它无法识别新尺寸：

这是我为模拟我正在做的事情而制作的小提琴：

如您所见，我已经设置了图像和画布的宽度和高度，但它仍然不适合给定大小的图像，并且仍然遵循原始图像的宽度和高度

ctx.putImageData(imgd, 20, 20);

我怎样才能使它适合高度和宽度

---

如果你能推荐一个好的图书馆，如果这个图书馆需要的话，我很乐意听

您使用的图像是48/48。为了在画布上获得20/20图像，您需要执行ctx.drawImageimage，0,0,20,20

另外，当您获取图像数据时，您不会执行以下操作：ctx.getImageData0、0、45、45，。由于您从20/20画布获取图像数据，因此需要执行ctx.getImageData0、0、20、20

我希望有帮助

var canvas=document.getElementByIdcanvas， ctx=canvas.getContext2d， image=document.getElementByIdtestImage； //用红色、绿色和蓝色条纹填充屏幕。 ctx.fillStyle=红色； ctx.fillRect0,0,20,20； ctx.drawImageimage，0,0,20,20； var imgd=ctx.getImageData0,0,20,20， pix=imgd.data； 对于变量i=0，n=pix.length；i

---

• [html]相关文章推荐

---

• 随机文章推荐