如何分配给 Three.js 模型文件的变量内容

Question

当您将模型从 Blender 导出到 Three.js 时，您最终会得到一个包含 JSON 数据的文件。我知道从该文件加载此模型的两种方法：

var loader = new THREE.JSONLoader()
var material = new THREE.MeshPhongMaterial({color: '#8080a0'})

1.

loader.load('tower.json', function (geometry) {
    var mesh = new THREE.Mesh(geometry, material)
})

2。编辑 tower.js 文件并添加

var tower = 

在第一行。然后你可以加载它：

var towerModel = loader.parse(tower)
var mesh = new THREE.Mesh(towerModel.geometry, material)

我更喜欢第二种解决方案，因为当您有数千个基于相同模型的网格时，每次想要创建一个网格时使用 loader.load() 函数非常慢，并且很容易杀死您的浏览器。

所以我的问题是 - 我可以在不手动编辑文件的情况下将来自 tower.json 文件的 JSON 数据获取到变量中吗？最好的解决方案是在不更改文件的情况下将 JSON 数据放入变量中。

Answer 1

我会选择选项 1。 将加载器添加到源文件中听起来很奇怪。 如果你问我，为了保持干净，你应该将加载器和数据源（你的模型文件）分开。

你为什么要重新加载相同的模型。您应该将其存储在变量中并重用它。两次加载相同的几何图形会浪费 CPU 和内存。

您可以轻松地做这样的事情来优化事情。这只是一个概念，但我希望你能明白：

// Storage for model files
myFiles = {
    tower: 'tower.json',
    car: 'car.json'
};

// Storage for loaded geometries
myModels = {
    tower: null,
    car: null
};

// Loader, loads only first time from file then from storage
var load = function( modelName ){
    if( myModels[modelName] === null ){
        loader.load(myFiles[modelName], function (geometry) {
            myModels[modelName] = geometry;
        });
    }

    var model = new THREE.Mesh(myModels[modelName], material)
    scene.add( model );
}

你可以按照你认为最好的方式来修改它。