错误：对象不是 THREE.Object3D 的实例

Question

我想添加一个从 adobe mixamo 下载的 fbx 模型。但是当我尝试运行代码时，它只显示带有此控制台错误的空白屏幕。 我在下面分享我的代码：

import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader.js';


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

const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
const controls = new OrbitControls(camera, renderer.domElement);

const alight = new THREE.AmbientLight(0x404040, 10); // soft white light
scene.add(alight);

const fbxloader = new FBXLoader();
let man = new THREE.Object3D();
fbxloader.load('TheBoss.fbx', function (fbx) {
    man = fbx.scene
    scene.add(man);
},
    function (xhr) {
        console.log((xhr.loaded / xhr.total * 100) + '% loaded');
    },  
    function (error) {

        console.error(error);

    });



camera.position.z = 5;
controls.update();

function animate() {
    requestAnimationFrame(animate);
    controls.update();


    renderer.render(scene, camera);
}

animate();

我试图将 fbx 模型加载到我的 Three.js 场景中。 我期待着我的场景中出现一个模型。

Answer 1

此处的问题似乎在于使用

FBXLoader

。

查看代码，

FBXLoader.load

返回一个没有

Group

属性的

scene

，从而导致了错误：

fbxloader.load(
    'TheBoss.fbx',
    // onload:
    function ( fbx ) {
        man = fbx.scene // error occurred here
        scene.add( man );
    },
...
);

相反，只需将返回的组直接添加到场景中即可。

fbxloader.load(
    'TheBoss.fbx',
    // onload:
    function ( fbxGroup ) {
        scene.add( fbxGroup );
    },
...
);