Threejs和着色器显示球体发光的问题

我正在研究3D可视化。我需要展示一个充满大气的世界，并且我以一个与threejs r40相同的例子为例，但我的r71。Threejs和着色器显示球体发光的问题

当我尝试添加大气（一种光晕，代表世界球的）我收到以下错误：

three.min.js:445 Uncaught TypeError: c.addEventListener is not a function

我的代码如下：

scene.add(createAtmosphere()); 

function createAtmosphere() { 

    shader = Shaders['atmosphere']; 
    uniforms = THREE.UniformsUtils.clone(shader.uniforms); 
    mesh = new THREE.Mesh(new THREE.Sphere(200, 40, 30), 
     new THREE.ShaderMaterial({ 

      uniforms: uniforms, 
      vertexShader: shader.vertexShader, 
      fragmentShader: shader.fragmentShader 

     }) 
    ); 

    mesh.scale.x = mesh.scale.y = mesh.scale.z = 1.1; 
    mesh.flipSided = true; 
    mesh.matrixAutoUpdate = false; 
    mesh.updateMatrix(); 
    return mesh; 
    }

，这是着色器

var Shaders = { 
    'atmosphere' : { 
     uniforms: {}, 
     vertexShader: [ 
     'varying vec3 vNormal;', 
     'void main() {', 
      'vNormal = normalize(normalMatrix * normal);', 
      'gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);', 
     '}' 
     ].join('\n'), 
     fragmentShader: [ 
     'varying vec3 vNormal;', 
     'void main() {', 
      'float intensity = pow(0.8 - dot(vNormal, vec3(0, 0, 1.0)), 12.0);', 
      'gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0) * intensity;', 
     '}' 
     ].join('\n') 
    } 
    };

我解决了另一个着色器问题，但是我无法找到这个问题（我对着色器不熟悉，并且让我发疯）。

在此先感谢

来源

2015-05-29 Germán Lena

你必须创建你的网发送SphereGeometry，而不是一个Sphere。

http://threejs.org/docs/#Reference/Objects/Mesh http://threejs.org/docs/#Reference/Extras.Geometries/SphereGeometry

scene.add(createAtmosphere()); 

function createAtmosphere() { 

    shader = Shaders['atmosphere']; 
    uniforms = THREE.UniformsUtils.clone(shader.uniforms); 
    mesh = new THREE.Mesh(new THREE.SphereGeometry(200, 40, 30), 
     new THREE.ShaderMaterial({ 

      uniforms: uniforms, 
      vertexShader: shader.vertexShader, 
      fragmentShader: shader.fragmentShader 

     }) 
    ); 

    mesh.scale.x = mesh.scale.y = mesh.scale.z = 1.1; 
    mesh.flipSided = true; 
    mesh.matrixAutoUpdate = false; 
    mesh.updateMatrix(); 
    return mesh; 
    }

来源

2015-05-29 00:44:41

是的，你是对的，其实我改变这显示地球（长前天）时。无论如何，使用SphereGeometry不会显示任何内容（https://gist.github.com/glena/0b2875044cd6c39ff150）。我应该回到D3并坚持2D hahaha –

@GermánLena你还是会得到你提到的错误吗？如果不是，它可能是你的着色器的问题。尝试首先使用普通材质创建网格，然后查看它是否显示。您可能还想将其标记为已回答并创建一个新问题，因为这是一个不同的问题。 –

你是对的，我在这里发布了一个新问题，你有什么线索吗？ http://stackoverflow.com/questions/30538512/issue-upgrading-threejs-with-shaders –

Threejs和着色器显示球体发光的问题

回答

相关问题