javascript - Loading DAE in Three.js

I have a problem, I can't load DAE file in Three.js. Can anybody help please.

I have model.dae in the same directory as index.html and when I load page it shows only black screen.

I had a file FBX and I exported it with Maya to 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>

I have a problem, I can't load DAE file in Three.js. Can anybody help please.

I have model.dae in the same directory as index.html and when I load page it shows only black screen.

I had a file FBX and I exported it with Maya to 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>

Share Improve this question edited Jan 31, 2014 at 16:21 mrdoob 19.6k4 gold badges66 silver badges62 bronze badges asked Jan 31, 2014 at 15:50 Milos Sretin 1,7482 gold badges25 silver badges47 bronze badges

Add a ment |

3 Answers 3

Sorted by: Reset to default 1

This is just a guess, but I suspect you're not loading the ColladaLoader properly.

Should be this:

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

Instead of this:

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

If this is the case you should be seeing a error in the console.

You might have to run your sample on a web server to be able to load the .dae files, since JavaScript does not allow file access on a client for security reasons.

I´ve had the same issue with DAE-Files i had created in Cinema4D. I had to export a FBX from C4D, import it to Blender and export the DAE with Blender.

C4D´s DAE-Exporter seems broken

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - Loading DAE in Three.js - Stack Overflow

3 Answers 3

与本文相关的文章

评论列表(0)