如何缩放 HTML 画布中的图像数据?

2024-01-06

我的网页中有一个画布;我在此画布中创建一个新的图像数据,然后通过修改一些像素myImgData.data[]大批。现在我想缩放该图像并使其更大。我尝试缩放上下文,但图像仍然很小。是否有可能做到这一点? 谢谢


您可以将 imageData 绘制到新画布上,缩放原始画布,然后将新画布绘制到原始画布上。

像这样的东西应该有效:

var imageData = context.getImageData(0, 0, 100, 100);
var newCanvas = $("<canvas>")
    .attr("width", imageData.width)
    .attr("height", imageData.height)[0];
    
newCanvas.getContext("2d").putImageData(imageData, 0, 0);
    
context.scale(1.5, 1.5);
context.drawImage(newCanvas, 0, 0);

这是一个功能演示http://jsfiddle.net/Hm2xq/2/ http://jsfiddle.net/Hm2xq/2/.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何缩放 HTML 画布中的图像数据? 的相关文章

随机推荐