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

Question

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

谢谢

- JayDee

---

@PeterMortensen，three.js不需要大写！ - WestLangley

Answer 1

好的，我找到了答案。

我们可以通过向相关对象添加自己的扩展方法来实现。对于纹理加载，我们可以通过向 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;
};

要加载字符串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 );
};

注意：以上代码适用于Three.js r49。如果新版本有代码更改，请将其添加到上述方法中以符合要求。

- JayDee

---

在 loadJson 函数中，url 是未定义的，我只是用 "" 替换了 this.extractUrlBase(url)，并将 context 更改为 this，在我的环境中运行得很好，感谢分享，这将是官方版本中的一个不错的功能。 - balazs