three.js - 为什么在three.js中看不到模型fbx？

Question

我正在尝试使用此 js 代码加载模型。

该代码基于此页面中的示例。 https://threejs.org/examples/?q=fbx#webgl_loader_fbx

function A1(){ 
    var scene  = new THREE.Scene();  
    var camera = new THREE.PerspectiveCamera(65,window.innerWidth/window.innerHeight, 0.1, 10000); 
    var container = document.getElementById( 'program3d' );  
    var renderer = new THREE.WebGLRenderer();                
    renderer.setSize(window.innerWidth   , window.innerHeight   );  
    container.appendChild( renderer.domElement );         
    renderer.setSize (400, 400);  
    renderer.setClearColor ( 0xC8C7C7 );  
    camera.position.z= 5; 
    camera.position.x= 0;
    camera.position.y= 0;
    var ambientLight = new THREE.AmbientLight ( 0xfffef5, 0.45 );  
    scene.add (ambientLight);
    var directionalLight = new THREE.DirectionalLight (0xfff2e8, 0.8 );  
    directionalLight.position.set (0.1, 1, 0.2);
    scene.add(directionalLight);
    var light1 =new THREE.PointLight(0xFFFFFF, 4 , 30);  
    //scene.add (light1);
    var light2 =new THREE.PointLight(0xFFFFFF, 4 , 30);  
    //scene.add (light2);   
    var light3 =new THREE.PointLight(0xFFFFFF, 4 , 30);  
    //scene.add (light3);
    var update = function (){   
    var time = Date.now() * 0.0005; 
        light1.position.x = Math.sin ( time * 0.7) * 30;
        light1.position.y = Math.cos ( time * 0.5) * 40;
        light1.position.z = Math.cos ( time * 0.3) * 30;
        light2.position.x = Math.cos ( time * 0.3) * 30;
        light2.position.y = Math.sin ( time * 0.5) * 40;
        light2.position.z = Math.sin ( time * 0.7) * 30;
        light3.position.x = Math.sin ( time * 0.7) * 30;
        light3.position.y = Math.cos ( time * 0.3) * 40;
        light3.position.z = Math.sin ( time * 0.3) * 30;};
                var loader = new THREE.FBXLoader();
                loader.load( 'models/2B.fbx', function ( object ) {
                    object.mixer = new THREE.AnimationMixer( object );
                    mixers.push( object.mixer );
                    var action = object.mixer.clipAction( object.animations[ 0 ] );
                    action.play();
                    object.traverse( function ( child ) {
                        if ( child.isMesh ) {
                            child.castShadow = true;
                            child.receiveShadow = true;
                        }});
                    scene.add( object );} );         
    var stats = new Stats();
    container.appendChild( stats.dom );
    var clock = new THREE.Clock();
    var mixers = [];
    function animate() {
    if ( mixers.length > 0 ) {
    for ( var i = 0; i < mixers.length; i ++ ) {
    mixers[ i ].update( clock.getDelta() );
    }}}     
    var controls = new THREE.TrackballControls (camera);  
    var end_scene = function(){
        requestAnimationFrame (end_scene);
        animate();
        controls.update();  
        renderer.render(scene, camera);  
        update();};
    end_scene();};

问题是：代码只显示一些模型。在控制台中没有任何错误

我检查代码的模型

工作 https://dropmefiles.com/6eQrs 不起作用 https://dropmefiles.com/Mxo2R 也许问题出在纹理上，但我不能肯定地说。

标签： three.js