Question

我正在尝试将我的模型从c4d导入到three.js中。我知道有一个OBJLoader对我来说很好。如果我想使用我的导出波前（.obj）并使用 convert_obj_three.py 转换它，它不会返回任何错误，并且json文件看起来很好。

但是如果我想在我的three.js脚本中加载生成的.js文件，它会返回：

未捕获的SyntaxError：意外的令牌;

这是我尝试过的：

var loader2 = new THREE.JSONLoader();
loader2.load('assets/models/test.js', createScene);
function createScene(){
    mesh = new THREE.Mesh();
    scene.add(mesh);
}

test.js：http://www.file-upload.net/download-7296129/test.js.html

错误：http://www.file-upload.net/download-7296139/screenie.png.html

这是整个代码：

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>three.js webgl - loaders - OBJ loader</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <style>
            body {
                font-family: Monospace;
                background-color: gray;
                color: #fff;
                margin: 0px;
                overflow: hidden;
            }
            #info {
                color: #fff;
                position: absolute;
                top: 10px;
                width: 100%;
                text-align: center;
                z-index: 100;
                display:block;
            }
            #info a, .button { color: #f00; font-weight: bold; text-decoration: underline; cursor: pointer }
        </style>
    </head>

    <body>
        <div id="info">
        <a href="http://threejs.org" target="_blank">three.js</a> - OBJLoader test
        </div>

        <script src="assets/three.min.js"></script>
        <script src="assets/OBJLoader.js"></script>

        <script src="assets/TrackballControls.js"></script>

        <script src="assets/Detector.js"></script>
        <script src="assets/stats.min.js"></script>

        <script>

            var container, stats;

            var camera, scene, controls, renderer;

            var mouseX = 0, mouseY = 0;

            var windowHalfX = window.innerWidth / 2;
            var windowHalfY = window.innerHeight / 2;


            init();
            animate();


            function init() {

                container = document.createElement( 'div' );
                document.body.appendChild( container );

                camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
                camera.position.z = 900;

                // controls

                controls = new THREE.TrackballControls( camera );

                controls.rotateSpeed = 5.0;
                controls.zoomSpeed = 5;
                controls.panSpeed = 2;

                controls.noZoom = false;
                controls.noPan = false;

                controls.staticMoving = true;
                controls.dynamicDampingFactor = 0.3;

                // scene

                scene = new THREE.Scene();

                var ambient = new THREE.AmbientLight( 0xfff3dd );
                scene.add( ambient );

                var directionalLight = new THREE.DirectionalLight( 0xffeedd );
                directionalLight.position.set( 0, 0, 1 ).normalize();
                scene.add( directionalLight );

                // model

                var loader2 = new THREE.JSONLoader();
                loader2.load('assets/models/test.js', function (geometry, materials){

                    mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
                    scene.add(mesh);

                });

                renderer = new THREE.WebGLRenderer();
                renderer.setSize( window.innerWidth, window.innerHeight );
                container.appendChild( renderer.domElement );
                window.addEventListener( 'resize', onWindowResize, false );

            }

            function onWindowResize() {

                windowHalfX = window.innerWidth / 2;
                windowHalfY = window.innerHeight / 2;

                camera.aspect = window.innerWidth / window.innerHeight;
                camera.updateProjectionMatrix();

                controls.handleResize();
                renderer.setSize( window.innerWidth, window.innerHeight );

            }

            function animate() {

                requestAnimationFrame( animate );
                render();

            }

            function render() {

                controls.update();
                renderer.render( scene, camera );

            }

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

Answer 1

加载json文件的函数：

THREE.JSONLoader.prototype.load = function ( url, callback, texturePath )



loader2.load('assets/models/test.js', function(geometry, materials){

   mesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
   scene.add(mesh);

});

语法错误JSONLoader

1 个答案: