Three.js getObjectByName提供undefined

时间:2015-10-16 14:48:21

标签: javascript three.js

我开始了我的第一个Three.js项目。太阳系,您可以看到here

我有一个函数addCelestrialObject(),我创建了行星,我希望这个函数能够自动创建它对行星所做的轨道圆圈,但我也希望它也适用于卫星。 所以每个星球(网格)都成为一个名称,我想访问这个对象以获得它的中心位置,所以如果我有月亮,我可以在这个位置添加一个圆圈。 我的问题是函数scene.getObjectByName(parent,true);始终提供undefined。检查网站时,您可以在example上看到console.log(scene)

function addCelestrialObject(name, type, parent, surface, bump, specular, 
    positionX, positionY, positionZ, size, clouds, drawcircle
) {
    var loader = new THREE.TextureLoader();
    var group = new THREE.Group();
    loader.load(surface, function (texture) {

        var geometry = new THREE.SphereGeometry(size, 32, 32);
        if (type == "sun") {
            var material = new THREE.MeshBasicMaterial({ map: texture });
            material.shading = true;
        } else {
            var material = new THREE.MeshPhongMaterial({ map: texture, overdraw: 0.5 });
            material.shading = true;
            if (bump) {
                material.bumpMap = THREE.ImageUtils.loadTexture(bump);
                material.bumpScale = 0.5;
            }
            if (specular) {
                material.specularMap = THREE.ImageUtils.loadTexture(specular);
                material.specular = new THREE.Color(0x222222);
            }
        }
        var mesh = new THREE.Mesh(geometry, material);
        mesh.name = name;
        mesh.position.x = positionX;
        mesh.position.y = positionY;
        mesh.position.z = positionZ;
        objectControls.add(mesh);
        mesh.select = function () {
            var position = { x: controls.target.x, y: controls.target.y, z: controls.target.z };
            var target = { x: this.position.x, y: this.position.y, z: this.position.z };
            var tween = new TWEEN.Tween(position).to(target, 500);
            tween.easing(TWEEN.Easing.Exponential.InOut)
            tween.onUpdate(function () {
                controls.target.x = position.x;
                controls.target.y = position.y;
                controls.target.z = position.z;
                controls.dollyIn(2);
            });
            tween.start();
            controls.minDistance = size * 5;
        }
        onRenderFcts.push(function (delta, now) {
            mesh.rotateY(1 / 32 * delta)
        });
        group.add(mesh);
    });

    if (clouds == true) {
        var canvasResult = document.createElement('canvas')
        canvasResult.width = 1024
        canvasResult.height = 512
        var contextResult = canvasResult.getContext('2d')

        // load earthcloudmap
        var imageMap = new Image();
        imageMap.addEventListener("load", function () {
            // create dataMap ImageData for earthcloudmap
            var canvasMap = document.createElement('canvas')
            canvasMap.width = imageMap.width
            canvasMap.height = imageMap.height
            var contextMap = canvasMap.getContext('2d')
            contextMap.drawImage(imageMap, 0, 0)
            var dataMap = contextMap.getImageData(0, 0, canvasMap.width, canvasMap.height)

            // load earthcloudmaptrans
            var imageTrans = new Image();
            imageTrans.addEventListener("load", function () {
                // create dataTrans ImageData for earthcloudmaptrans
                var canvasTrans = document.createElement('canvas')
                canvasTrans.width = imageTrans.width
                canvasTrans.height = imageTrans.height
                var contextTrans = canvasTrans.getContext('2d')
                contextTrans.drawImage(imageTrans, 0, 0)
                var dataTrans = contextTrans.getImageData(0, 0, canvasTrans.width, canvasTrans.height)
                // merge dataMap + dataTrans into dataResult
                var dataResult = contextMap.createImageData(canvasMap.width, canvasMap.height)
                for (var y = 0, offset = 0; y < imageMap.height; y++) {
                    for (var x = 0; x < imageMap.width; x++, offset += 4) {
                        dataResult.data[offset + 0] = dataMap.data[offset + 0]
                        dataResult.data[offset + 1] = dataMap.data[offset + 1]
                        dataResult.data[offset + 2] = dataMap.data[offset + 2]
                        dataResult.data[offset + 3] = 255 - dataTrans.data[offset + 0]
                    }
                }
                // update texture with result
                contextResult.putImageData(dataResult, 0, 0)
                material.map.needsUpdate = true;
            })
            imageTrans.src = 'textures/earthcloudmaptrans.jpg';
        }, false);
        imageMap.src = 'textures/earthcloudmap.jpg';

        var geometry = new THREE.SphereGeometry(size + 0.5, 32, 32)
        var material = new THREE.MeshPhongMaterial({
            map: new THREE.Texture(canvasResult),
            side: THREE.DoubleSide,
            transparent: true,
            opacity: 1,
            shading: true,
        })
        var cloudMesh = new THREE.Mesh(geometry, material);
        cloudMesh.position.x = positionX;
        cloudMesh.position.y = positionY;
        cloudMesh.position.z = positionZ;
        group.add(cloudMesh);
        onRenderFcts.push(function (delta, now) {
            cloudMesh.rotateY(1 / 16 * delta)
        });
    }
    if (drawcircle == true) {
        //circle
        var radius = Math.abs(distance(0, positionX, 0, positionZ));
        segments = 64;
        materialLine = new THREE.LineBasicMaterial({ color: 0x00a8ff });

        geometry = new THREE.CircleGeometry(radius, segments);
        // Remove center vertex
        geometry.vertices.shift();
        circle = new THREE.Line(geometry, materialLine);
        circle.rotation.x = 1.571;
        if (parent) {
            var object = scene.getObjectByName(parent, true);

            //circle.position.x=object.position.x;
            //circle.position.y=object.position.y;
            //circle.position.z=object.position.z;
        }
        group.add(circle);
    }
    scene.add(group);
}

0 个答案:

没有答案