3d Three.js纹理加载失败

我正在用three.js制作一个动画我是triyng在屏幕中心旋转两个球体，第一个球体包含第二个球体（它们有相同的坐标，但有一个我稍微大一点）。我试图模拟一个有大气层的真实地球仪

我从添加大气的three.js earth globe示例开始

在那之后，我从零开始写了所有的东西，以便有一个框架来渲染许多行星和它们的大气层

但是，正如您所看到的，我的代码中有一个错误，它避免了正确的纹理加载。 看着里面的实物，似乎都在里面。我想我是在加载纹理之前在场景中添加项目的。但是我找不到一种方法来编辑代码让它工作

---

我希望有一个好的答案；）

纹理加载完成后，您将创建MeshPhongMaterial。但是，在加载纹理之前，已创建网格。由于该.atmospher_材料尚未定义，因此使用基本材料

在加载器函数中，您有一个作用域错误，可能导致此问题：

      this.loader.load( 'app/textures/atmospheres/earth_1.jpg', function ( texture ) {
        this.atmosphere_material = new THREE.MeshPhongMaterial({
          map: texture,
          color: 10790052,
          ambient: 16777215,
          emissive: 1381653,
          specular: 16777215,
          shininess: 5000,
          opacity: 0.46,
          transparent: true,
          wireframe: false
        });
      });

未在地球对象上设置this.atmosphere_材质属性。在这个回调中，作用域是不同的。以下是加载纹理的更简单方法：

var Earth = function() {

      this.planet = new THREE.Object3D();
      this.planet_geometry = new THREE.SphereGeometry( 200, 32, 32 );

      this.atmosphere = new THREE.Object3D();
      this.atmosphere_geometry = new THREE.SphereGeometry( 205, 32, 32 );

      this.material = new THREE.MeshPhongMaterial({
          map: THREE.ImageUtils.loadTexture( "app/textures/surfaces/earth.jpg" ),
          color: 13750737,
          ambient: 13092807,
          emissive: 595494,
          specular: 3223857,
          shininess: 25,
          opacity: 1,
          transparent: false,
          wireframe: false,
      });

      this.surface = new THREE.Mesh( this.planet_geometry, this.material );
      this.planet.add(this.surface);
      scene.add( this.planet );


      this.atmosphere_material = new THREE.MeshPhongMaterial({
          map: THREE.ImageUtils.loadTexture( "app/textures/atmospheres/earth_1.jpg" ),
          color: 10790052,
          ambient: 16777215,
          emissive: 1381653,
          specular: 16777215,
          shininess: 5000,
          opacity: 0.46,
          transparent: true,
          wireframe: false
        });

      this.surface = new THREE.Mesh( this.atmosphere_geometry, this.atmosphere_material );
      this.atmosphere.add(this.surface);
      scene.add( this.atmosphere );
    }

---

我没有测试代码，但应该是正确的。

您想实现什么？你是说你看到的重叠纹理，线框吗？