Question

我遇到问题，我无法在Three.js中加载DAE文件。请有人帮忙。

我将model.dae放在与index.html相同的目录中，当我加载页面时，它只显示黑屏。

我有一个文件FBX，我用Maya将它导出到FBX_DAE

<html>
<head>
    <title>My first Three.js app</title>
    <style>canvas { width: 100%; height: 100% }</style>
</head>
<body>
    <style type="text/css">
        html, body {
            margin:0;
            padding: 0;
        }
    </style>
    <script src="js/three.min.js"></script>
    <script src="js/ColladaLoader.min.js"></script>
    <script>
        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 );

        loader = new THREE.ColladaLoader();
        loader.load('model.DAE',function colladaReady( collada ){
        player = collada.scene;
        skin = collada.skins [ 0 ];
        scene.add( player );
        });

        /*
        var geometry = new THREE.CubeGeometry(1,1,1);
        var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
        var cube = new THREE.Mesh( geometry, material );
        scene.add( cube );
        */

        camera.position.z = 5;

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

            //cube.rotation.x += 0.1;
            //cube.rotation.y += 0.1;
        }
        render();

    </script>
</body>
</html>

Answer 1

这只是猜测，但我怀疑你没有正确加载ColladaLoader。

应该是这样的：

<script src="js/ColladaLoader.js"></script>

而不是：

<script src="js/ColladaLoader.min.js"></script>

如果是这种情况，您应该在控制台中看到错误。

Answer 2

您可能必须在Web服务器上运行示例才能加载.dae文件，因为出于安全原因，JavaScript不允许在客户端上进行文件访问。

Answer 3

我在Cinema4D中创建的DAE-Files遇到了同样的问题。我不得不从C4D导出FBX，将其导入Blender并用Blender导出DAE。

C4D的DAE-Exporter好像坏了

在Three.js中加载DAE

3 个答案: