Question

我是three.js的新手，并且无法将collada对象加载到它。我无法回家。在浏览器中渲染。

我根据答案更新了SECOND UPDATE下的代码。

        // INITIAL

        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);

        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);

        var loader = new THREE.ColladaLoader();
        loader.load('home.dae', function(collada){
            scene.add(collada);
        });

        function render() {
          renderer.render(scene, camera);
        }

        render();


        // SECOND UPDATE

        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
        camera.position.set(0,1,4);
        camera.lookAt(scene.position);

        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);

        var loader = new THREE.ColladaLoader();

        loader.load('home.dae', function(collada){
            scene.add(collada.scene);
        });

        function render() {
            requestAnimationFrame(render);
            renderer.render(scene, camera);
        }

        render();

Answer 1

您的渲染功能仅被调用一次。试试这个 -

find

同时检查文件路径是否有效。

Answer 2

几乎没有想到的事情：

正如@Rasheduzzaman已经注意到的那样，渲染函数太早调用（当你调用render()时，scene.add(collada);调用不可能发生。请改用他的答案。
collada-loader的工作方式略有不同：文档不清楚这一点，但返回的对象是可能存在于collada文件中的所有内容的集合，请参阅此处获取列表：{ {3}}（另外：使用browser-devtools中的调试器来检查你在那里找到的数据）。您可能希望scene.add(collada.scene)或类似。
您没有为相机设置位置，因此它位于（0,0,0），这可能不是一个好主意，请尝试camera.position.set(0,1,4)或类似的东西。
您需要知道会发生什么：您要加载的模型的大小是多少？放在哪里？确保将相机对准（可以使用camera.lookAt(object.position)）并相应地调整nearPlane和farPlane。

如何将collada对象加载到three.js？

2 个答案: