THREE.JS不向场景添加对象

时间:2014-05-02 17:24:45

标签: javascript object three.js

我尝试了更好的组织场景的方法。最终的想法是,我希望能够简单地添加属性或更改参数,而无需查找声明变量的位置,因为许多初学者示例都充满了var this和var。我有什么看起来应该工作,但由于某种原因,对象不会添加到场景中。

这是我的代码

var setup = {
    container: function () {
        return $("#test");
    },
    WIDTH: function () {
        return this.container().width();
    },
    HEIGHT: function () {
        return this.container().height();
    },
    renderer: function () {
        var renderer = Detector.webgl ? new THREE.WebGLRenderer() : new     THREE.CanvasRenderer();
        return renderer;
    },
    scene: function () {
        return new THREE.Scene();
    }
};


var sceneObjects = {
    cameras: {
        cam1: {
            init: function () {
                var camera = new THREE.PerspectiveCamera(
                this.properties.VIEW_ANGLE,
                this.properties.ASPECT(),
                this.properties.NEAR,
                this.properties.FAR);
                return camera;
            },
            properties: {
                VIEW_ANGLE: 45,
                ASPECT: function () {
                    return setup.WIDTH() / setup.HEIGHT();
                },
                NEAR: 0.1,
                FAR: 10000
            },
            position: {
                x: undefined,
                y: undefined,
                z: 300
            }
        }
    },
    meshes: {
        sphere: {
            size: {
                radius: 50,
                segments: 16,
                rings: 16
            },
            color: 0xCC0000,
            material: function () {
                return new THREE.MeshLambertMaterial({
                    color: this.color
                });
            },
            init: function () {
                return new THREE.Mesh(
                new THREE.SphereGeometry(

                this.size.radius,
                this.size.segments,
                this.size.rings),
                this.material());
            }
        }
    },
    lights: {
        pointLight1: {
            position: {
                x: 10,
                y: 50,
                z: 130
            },
          color: 0xFFFFFF,

            init: function () {
                return new THREE.PointLight(this.color);

            }
        }
    }

};



function init() {
    for (var objectGroup in sceneObjects) {
        if (sceneObjects.hasOwnProperty(objectGroup)) {
            for (var object in sceneObjects[objectGroup]) {
                if (sceneObjects[objectGroup].hasOwnProperty(object)) {
                    object = sceneObjects[objectGroup][object];
                    var scene = setup.scene();
                    console.log(object.init());
                    scene.add(object.init());
                    if (object.hasOwnProperty('position')) {
                        for (var coord in object.position) {
                            if (object.position.hasOwnProperty(coord)) {
                                if (coord) {
                                    object.init().position[coord] = object[coord];
                                }
                            }
                        }
                    }
                }
            }
        }


    }
    var renderer = setup.renderer();
    renderer.setSize(setup.WIDTH(), setup.HEIGHT());
    setup.container().append(renderer.domElement);
    renderer.render(scene, sceneObjects.cameras.cam1.init())

    console.log(scene)

}
init();

当我记录对象变量时,它肯定会返回预期的MESH对象以及Camera对象和light对象。当我记录场景时,会创建一个明确的场景,但奇怪的是,在webglobjects属性下有一个空数组。为什么scene.add()无法在此模型中运行?

0 个答案:

没有答案