THREE.Object3D.add: 对象不是 THREE.Object3D 的实例 [英] THREE.Object3D.add: object not an instance of THREE.Object3D

问题描述

所以我收到这个错误，我找不到它的来源.我相信这与我在场景中导入和创建 3d 对象有关，但我不确定我做错了什么.

so i'm getting this error and I cant find the source of it. I believe it has to do with me importing and creating my 3d objects in my scene but i'm not sure what i'm doing wrong.

代码如下:我在调用 init 之前调用这个函数

here is the code: I call this function before I call init

function loadObjects()
{
loader = new THREE.JSONLoader();

var floorDiskmaterial = new THREE.MeshPhongMaterial({
    map: THREE.ImageUtils.loadTexture('img/floor_test.jpg'),
    transparent: true,
    color: 0xeaeaea,
    ambient: 0xeaeaea,
    overdraw: 0.5,
    //specular: 0x6a3e6d,
    shading: THREE.FlatShading,
    fog: false,
    //shininess: 50,
});

loader.load( "models/floorScene.js", function( geometry ) {
    FloorDiskFire = new THREE.Mesh( geometry, floorDiskmaterial);
    FloorDiskFire.position.set(0,0.2,0);
    FloorDiskFire.castShadow = true;
    FloorDiskFire.receiveShadow = true;
    FloorDiskFire.scale.set(1.5,1.5,1.5);
    //FloorDiskFire.rotation.y = -0.78;
} );

//-----Pillar Loader------//

var pillarMaterial = new THREE.MeshPhongMaterial({
    //map: THREE.ImageUtils.loadTexture('img/pillarMap.png'),
    //transparent: true,
    color: 0xeaeaea,
    ambient: 0xeaeaea,
    overdraw: 0.5,
    //specular: 0x6a3e6d,
    shading: THREE.FlatShading,
    fog: false,
    //shininess: 50,
});

loader.load( "models/pillar.js", function( pillar ) {
    firePillar = new THREE.Mesh(pillar, pillarMaterial);
    firePillar.position.set(135,0,135);
    firePillar.castShadow = true;
    firePillar.receiveShadow = true;
    firePillar.scale.set(1.7,1.7,1.7);
} );

loader.load( "models/pillar.js", function( pillar ) {
    earthPillar = new THREE.Mesh(pillar, pillarMaterial);
    earthPillar.position.set(135,0,-135);
    earthPillar.castShadow = true;
    earthPillar.receiveShadow = true;
    earthPillar.scale.set(1.7,1.7,1.7);
} );

loader.load( "models/pillar.js", function( pillar ) {
    airPillar = new THREE.Mesh(pillar, pillarMaterial);
    airPillar.position.set(-135,0,135);
    airPillar.castShadow = true;
    airPillar.receiveShadow = true;
    airPillar.scale.set(1.7,1.7,1.7);
} );

loader.load( "models/pillar.js", function( pillar ) {
    waterPillar = new THREE.Mesh(pillar, pillarMaterial);
    waterPillar.position.set(-135,0,-135);
    waterPillar.castShadow = true;
    waterPillar.receiveShadow = true;
    waterPillar.scale.set(1.7,1.7,1.7);
} );
}

然后在 init 中我将对象添加到场景中

Then in init I add the objects to the scene

loader.onLoadComplete=function(){
    scene.add(FloorDiskFire);

    scene.add(firePillar);
    scene.add(earthPillar);
    scene.add(waterPillar);
    scene.add(airPillar);
};

推荐答案

好吧，问题来了，add调用在错误的时间调用，因为我没有从头开始编写这段代码，也没有时间进行非常深入的调试，但是我会给你一个错误提示，我相信你会发现以后很容易找到错误，因为我认为你的一些对象在你尝试将它们添加到场景时仍在加载.

Ok here is the issue , the add call is invoked in wrong time , because i havent written this code from scratch and dont have time for very deep debugging , but i will give you a hint of what is wrong , and im sure you will find it easy to find the bug later , cause i think some of your objects are still loading while you are trying to add them to scene.

程序:

我变了

loader.onLoadComplete=function(){
        scene.add(FloorDiskFire);
        //scene.add(FloorDiskEarth);
        //scene.add(FloorDiskWater);
        //scene.add(FloorDiskAir);

        scene.add(firePillar);
        scene.add(earthPillar);
        scene.add(waterPillar);
        scene.add(airPillar);
    }

将操作分组到一个名为 addObjects(); 的新函数中:

grouped the action in one new function called addObjects(); :

function addObjects(){
        scene.add(FloorDiskFire);
        //scene.add(FloorDiskEarth);
        //scene.add(FloorDiskWater);
        //scene.add(FloorDiskAir);

        scene.add(firePillar);
        scene.add(earthPillar);
        scene.add(waterPillar);
        scene.add(airPillar);
    };

然后在您的 init() 函数中我调用了 addObjects(); ，但它仍然给出相同的错误！！所以我尝试在一段时间后调用它 - 在第 309 行 > index.html :

then in your init() function i invoked the addObjects(); , but it still give the same error !! so i tried invoking it after sometime - in line 309 > index.html :

setTimeout(function(){addObjects();},1000);

请注意，我已经尝试了 100 毫秒，但没有奏效，然后 1 秒效果很好，这不是解决方案，这只是表明如果您延迟函数调用，一切都会正常进行，这是您现在的工作确定何时调用它(即找到调用函数的正确事件)，因为 loader.onLoadComplete 似乎没有完成这项工作.

please note that i have tried 100ms , and it didnt work , then 1 second works well , this is not a solution , it is just and indication that if you delay the function call everything will work fine , it is your job now to determine when to call it (i.e find the proper event to invoke the function ) as it appears that loader.onLoadComplete is not doing the job.

您可以在此处找到修改后的文件.

you can find the modified file here.

这篇关于THREE.Object3D.add: 对象不是 THREE.Object3D 的实例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！