javascript 调整大小后的图像未显示

3wabscal 于 2022-10-30 发布在 Java

关注(0)|答案(1)|浏览(252)

我正在尝试将原始照片（corgi.png）的大小调整为100 x 100。我可以使用以下代码来显示原始照片：（图像，0，0）;但是调整大小的照片（100 x100）没有显示。我在做什么wr 0 ng？

let canvas = document.getElementById("demoCanvas");
let context = canvas.getContext("2d");

let image = new Image();
image.src = "corgi.png";
image.onload = () => {

  context.drawImage(image, 0, 0);

  let smallImageData = new ImageData(100,100);

  context.putImageData(smallImageData, 500, 0);

};

JavaScript

来源：https://stackoverflow.com/questions/74242947/resized-image-is-not-showing

1条答案

按热度按时间

cetgtptt1#

我不明白您为什么在这里同时使用drawImage和putImageData。
将syntax用于drawImage就足以得到所需的结果：

drawImage(image, dx, dy, dWidth, dHeight)

使用此方法，您的代码将如下所示：

let image = new Image();
image.src = "corgi.png";
image.onload = () => {
  context.drawImage(image, 500, 0, 100, 100);
};

***注意：*请确保画布宽度大于dx + dWidth，即500 + 100 = 600。否则，您的图像将不可见。

let canvas = document.getElementById("demoCanvas");
canvas.width = 1000; // >=600

赞(0）回复(0）举报 2022-10-30

我来回答

javascript 调整大小后的图像未显示

1条答案

相关问题

热门标签

最新问答