三个js无法将球体渲染到屏幕上

时间:2013-02-15 12:07:09

标签: three.js webgl

是的,我想让一个sphree渲染到屏幕上。这是我的js文件。

function Earth()
{
    this.getEarth = init();

function init()
{
    var map = {map:THREE.ImageUtils.loadTexture("images/earth_surface_2048.jpg")};
    var material = new THREE.MeshBasicMaterial(map);
    var geometry = new THREE.SphereGeometry(1,32,32);
    return new THREE.Mesh(geometry, material);
}

function update()
{
    getEarth.rotation.x += .01;
}
}

这是html文件中的脚本 页面中包含threejs。

    <script>

    var renderer = null;
    var scene = null;
    var camera = null;
    var mesh = null;
    var earth = null;

    $(document).ready(
            function() {
                var container = document.getElementById("container");
                renderer = new THREE.WebGLRenderer({ antialias: true } );
                renderer.setSize(container.offsetWidth,container.offsetHeight);
                container.appendChild(renderer.domElement)
                scene = new THREE.Scene();
                camera = new THREE.PerspectiveCamera( 45,
                        container.offsetWidth / container.offsetHeight, 1, 4000 );

                earth = new Earth();
                scene.add(camera);
                scene.add(earth.getEarth);
                renderer.render( scene, camera );
            }
    );


</script>

我从调试器中得到没有错误,所以任何想法?

1 个答案:

答案 0 :(得分:1)

earth.getEarth可能为null或函数。我记得scene.add()默默地忽略它不能采取的东西,比如未定义的值等等。

如何将var getEarth = init();更改为this.getEarth = init();,以便类范围之外的代码可以在地球对象中看到该变量。虽然我建议不要为包含对象的变量使用类似方法的名称。