webgl纹理中的原始jpeg数据同步加载

Hi I hava jpeg压缩数据存储在Uin8Array中。我在Webgl中读到了关于纹理的内容。所有链接加载图像后我看到的初始化纹理（由jpeg数据创建，image.src=“some data”image.onload（加载纹理））。但这是一个异步过程。这个过程很好。但是我可以使用CompressedEximage2D（目标、级别、内部格式、宽度、高度、边框、数据）函数吗？internel格式应该与jpeg相关，并且数据将以压缩jpeg格式的形式（宽度或高度不是pow形式的2）显示，以便整个过程应该是同步的？或者webgl中的任何其他方法直接获取jpeg压缩数据而不加载图像

因此，以下是截至2012年9月的坏消息：WebGL实际上不支持

CompressedEximage2D

。如果尝试调用该函数，它将始终返回

无效\u ENUM

错误。如果您感到好奇，请参阅规范中的解释部分

现在，一些好消息是，您可以从jpeg数据的

Uint8Array

创建纹理。我不确定如何同步完成这项工作，但这段代码可能会有所帮助

基本上，我们必须将原始的

Uint8Array

数据转换为base64字符串，这样我们就可以用base64字符串作为图像源创建一个新图像

下面是代码：

function createTexture(gl, data) {
    var stringData = String.fromCharCode.apply(null, new Uint16Array(data));
    var encodedData = window.btoa(stringData);
    var dataURI = "data:image/jpeg;base64," + encodedData;

    texture = gl.createTexture();
    texture.image = new Image();

    texture.image.onload = function () {
        gl.bindTexture(gl.TEXTURE_2D, texture);
        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.image);
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
        gl.bindTexture(gl.TEXTURE_2D, null);
    };

    texture.image.src = dataURI;

    return texture;
}

我有一个功能的演示。为了保持文件小，我只使用24x24像素的jpeg。如果您想知道，该函数也适用于高度/宽度为2的非幂次jpeg

如果您想查看演示的完整源代码，请查看