Javascript:将存储为Uint8Array的PNG渲染到没有数据URI的画布元素上 |
您所在的位置:网站首页 › JS加载图片并且转为unit8array › Javascript:将存储为Uint8Array的PNG渲染到没有数据URI的画布元素上 |
我正在尝试渲染存储在javascript Uint8Array中的PNG图像。我最初尝试的代码如下: var imgByteStr = String.fromCharCode.apply(null, this.imgBytes); var pageImg = new Image(); pageImg.onload = function(e) { // Draw onto the canvas canvasContext.drawImage(pageImg, 0, 0); }; // Attempt to generate the Data URI from the binary // 3rd-party library adds toBase64() as a string function pageImg.src="data:image/png;base64,"+encodeURIComponent(imgByteStr.toBase64());然而,我发现由于某种原因,onload函数从来没有运行过(我在chrome中设置了断点,它根本就没有命中)。我发现,如果将src设置为URL而不是数据URI,它可以正常工作。然而,由于一些限制,我不能直接引用图像的URL,也就是说,它必须从UInt8Array加载。 此外,更复杂的是,这些图像的大小可能是兆字节。据我所知,对于非常大的图像,尝试使用数据URI存在兼容性问题。正因为如此,我非常犹豫是否要使用它们。 因此,问题是如何在不使用数据URL或直接引用图像URL的情况下将此字节数组作为PNG呈现到画布上下文中? 我还尝试使用类似下面的代码,通过putImageData函数直接操作图像数据。请记住,我不是100%理解这个函数是如何工作的 var imgdata = canvasContext.createImageData(this.baseHeight, this.baseWidth); var imgdatalen = imgdata.data.length; for(var i=0; i |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |