三.js 三的错误.对象加载器

Three.js Error with THREE.ObjectLoader

本文关键字：加载 对象 错误 js      更新时间：2023-09-26

我似乎在Three.ObjectLoader上遇到了问题。 我正在以 JSON 格式 4.3 导出场景。 此场景包括几何体、材质和灯光。 场景在三.js编辑器中打开就很好，没有任何错误。

我正在使用 Three.js r70 master在火狐上工作。以下是生成的 json 的链接： https://gist.github.com/fraguada/d86637f7987096b361ea

在我尝试编写的查看器中，我使用以下代码进行加载：

var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
    console.log( item, loaded, total );
};
// instantiate a loader 
var loader = new THREE.ObjectLoader(manager);
loader.load( 
    // resource URL coming from other file
    Name, 
    // Function when resource is loaded 
    function ( result ) 
    { scene.add( result.scene ); }, 
    // Function called when download progresses 
    function ( xhr ) 
    { console.log( (xhr.loaded / xhr.total * 100) + '% loaded' ); }, 
    // Function called when download errors 
    function ( xhr ) 
    { console.log( 'An error happened' ); } 
);

在控制台中，我看到以下内容：

THREE.WebGLRenderer 70  three.min.js (line 513)
100% loaded content.js (line 117)
THREE.Object3D.add: undefined is not an instance of THREE.Object3D. three.min.js (line 164)
js/Test83.js 1 1    content.js (line 86)

该错误也出现在未缩小的三个中.js在第 7674 行

如果我在 Three.js 编辑器中创建几何体和其他对象并将其导出为场景，也会出现此问题。

问题似乎在这里：scene.add( result.scene );我假设三个不正确。对象加载器可以使用文件中的 JSON 吗？ 在我发布的代码中，如果我删除scene.add( result.scene );似乎至少加载了文件（数据加载，没有可视化几何图形），因为没有出现错误。 如果我的场景有很多网格，进度会输出到控制台（10% 加载，20% 加载等）。

任何见解将不胜感激。

经过更多的挖掘，我意识到我需要使用THREE。XHRLoader 引入 json，然后使用 THREE。对象加载器来解析结果。 这样的事情应该有效：

var loaderObj = new THREE.ObjectLoader();
var loader = new THREE.XHRLoader();
            loader.load( 'js/data.json', function ( text ) {
                text = "{ '"scene'" : " + text + " }";
                var json = JSON.parse( text );
                var scene = loaderObj.parse( json.scene );
            },
            // Function called when download progresses 
            function ( xhr ) 
            { console.log( (xhr.loaded / xhr.total * 100) + '% loaded' ); }, 
            // Function called when download errors 
            function ( xhr ) 
            { console.log( 'An error happened' ); }  );

这种方法效果很好，并且是通过检查通过 ThreeJS 编辑器发布场景时生成的代码来学习的。

我认为你应该scene.add( result )去做。

相关文章：