是否可以从three.js中的字节数组加载图像和模型？

I know that in three.js we can load images directly from the server with ImageUtils and models as .js files with the JSONLoader, but is it possible to load images and models from byte arrays directly? (for example, download a compressed file, extract it in javascript and feed the byte array directly into the loaders?)

我知道在three.js中我们可以使用ImageUtils直接从服务器加载图像，使用JSONLoader将模型作为.js文件加载，但是可以直接从字节数组加载图像和模型吗？（例如，下载压缩文件，在javascript中解压缩并将字节数组直接送入加载器？）

thanks

谢谢

1 个解决方案

#1

alright, found the answers. it can be done by adding our own extension methods to the concerned objects. for the texture loading we can load a binary array by adding a new method to imageutils like this:

好吧，找到了答案。可以通过将我们自己的扩展方法添加到相关对象来完成。对于纹理加载，我们可以通过向imageutils添加一个新方法来加载二进制数组，如下所示：

THREE.ImageUtils.prototype.loadTextureBinary = function ( data, mapping, callback ) {

    var image = new Image(), texture = new THREE.Texture( image, mapping );

    image.onload = function () { texture.needsUpdate = true; if ( callback ) callback( this ); };
    image.crossOrigin = this.crossOrigin;
    image.src = "data:image/png;base64," + Base64.encode(data);

    return texture;

};

for loading string json, extract your data and make it into a string and pass it to this new extension method of JSONLoader:

用于加载字符串json，提取数据并将其转换为字符串并将其传递给JSONLoader的这个新扩展方法：

THREE.JSONLoader.prototype.loadJson = function ( data, callback, texturePath ) {

    var worker, scope = this;

    texturePath = texturePath ? texturePath : this.extractUrlBase( url );

    this.onLoadStart();
    var json = JSON.parse( data );
    context.createModel( json, callback, texturePath );

};

note: the above code is for three.js r49. if a newer version has code changes, add them to the above methods to comply.

注意：上面的代码适用于three.js r49。如果较新版本的代码更改，请将它们添加到上述方法以符合要求。

#1

THREE.ImageUtils.prototype.loadTextureBinary = function ( data, mapping, callback ) {

    var image = new Image(), texture = new THREE.Texture( image, mapping );

    image.onload = function () { texture.needsUpdate = true; if ( callback ) callback( this ); };
    image.crossOrigin = this.crossOrigin;
    image.src = "data:image/png;base64," + Base64.encode(data);

    return texture;

};